CSS3学习总结

1、border-radius:圆角效果
    　　（1）border-radius:5px 5px 5px 5px ;如果有4个参数，代表4个角
    　　（2）border-radius:5px 5px；2个参数，代表top-left,bottom-rigt和top-right,bottom-left;
    　　（2）border-radius:5px 5px 5px；3个参数，代表top-lett和top-right，bottom-left和bottom-right；
2、box-shadow: 添加阴影
            第一个参数是往右偏移: box-shadow:10px 0 0 0 red ；
            第二个参数是往下偏移: box-shadow:0 10px 0 0 red ；
            第三个参数是偏移部位模糊效果,越大越模糊：box-shadow:0 10px 10px 0 red  ；
           （1）background-size: contain; 缩小背景图片使其适应标签元素（主要是像素方面的比率）；
   　　  （2）background-size: cover; 让背景图片放大延伸到整个标签元素大小（主要是像素方面的比率）；
   　　  （3）background-size: 100px 100px; 标明背景图片缩放的尺寸大小；
    　　 （4）background-size: 50% 100%; 百分比是根据内容标签元素大小来缩小放大；
3、CSS3选择器
    　　 （1）E：nth-child（n）：匹配父元素的第n个子元素E；
    　　 （2）E：nth-last-child（n）：匹配父元素的倒数第n个子元素E；
    　　 （3）E：nth-of-type（n）：匹配同类型中的第n个同级兄弟元素E；
    　　 （4）E：nth-last-of-type（n）：匹配同类型中的倒数第n个同级兄弟元素E；
    　　 （5）E：only-of-type：匹配同类型中的唯一的一个同级兄弟元素E；
    　　 （6）E：empty：匹配没有任何子元素（包括text节点）的元素E；
    　　 （7）E：checked：单选框、复选框被选中时的效果；
   　　  （8）input：focus；输入控件激活时的效果。