一个div中图片的尺寸根据后台返回的个数决定，要求：

1. 一张图片一行显示尺寸690px；
2. 2张图片一行显示尺寸320px，4张图片两行显示，每行2张各占320px。
3. 大于3张图片，每行3张排列，每张图片各占200px。

一张图片

2张图片

3张图片

4张图片

css样式

        div {
            width: 750px;
            border: 2px solid gray;
        /* 默认3张以上的样式（不包括4张） */
        div img {
            width: 200px;
            border: 2px solid red;
        /* 当只有一张图片的样式 */
        div img:only-child {
            width: 690px;
            border: 2px solid red;
        /* 既是倒数第二张又是第一张说明有两张图片 */
        div img:nth-last-child(2):first-child,
        /* ~表示同属于父类的所有img兄弟元素 */
        img:nth-last-child(2):first-child~img {
            width: 320px;
            border: 2px solid red;
        /* 表示有四张图片 */
        div img:nth-last-child(4):first-child,
        img:nth-last-child(4):first-child~img {
            width: 320px;
            border: 2px solid red;
                    背景一个div中图片的尺寸根据后台返回的个数决定，要求：一张图片尺寸690px；2张图片每张占320px，4张图片两行展示，每行2张各占320px。大于3张图片，每行3张排列，每张图片各占200px。实现效果...
:only-child 匹配属于其父元素的唯一子元素的每个元素。
:last-child 选择属于其父元素最后一个匹配子元素。
:first-child 选择属于其父元素最后一个匹配子元素。
:nth-child(n) 选择属于其父元素的第n个子元素。
:nth-last-child(n) 同上，从最后一个子元素开始计数。
:nth-last-child(an...
				
这里记录面试融众集团的一道题
Q：说可能有1~3个item显示在同一行，而item的个数不一定，如果1个，那这个item占宽100%，2个时每一个50%，3个时每一个33%，用纯CSS实现。
A：先贴答案。
  <style>
    section {
      width: 100%;
    .item {
      float: left;
				
css中“>”是在子元素选择器中出现的:
　　“>”是css3特有的选择器，表明class样式只作用于子级元素，对于子级再往下的元素则忽略不计，比如孙级的元素就会被忽略。只能选择作为某元素的最近一级子元素，简单理解就是选亲儿子元素。
   A>B 表示选择A元素的所有子B元素。
　　与A B的区别在于，A B选择所有后代元素，而A>B只选择一代。
				VM296:1 Uncaught SyntaxError: Unexpected token u in JSON at position 0 at JSON.parse (<anonymous>)