CSS学习笔记

1. 使用div比使用table，浏览器的加载速度更快，利于搜索引擎的优化。
2. 不要使用@import方式导入CSS样式表文件，因为在网速较慢时，页面的样式可能会出现混乱。推荐使用<link rel="stylesheet" type="text/css" href=""/>方式。
3. CSS继承性依赖于HTML中元素的父-子级关系。board, margin, padding, background等属性是不会被继承的，否则会导致样式的混乱。
4. CSS样式匹配优先级遵循:带有!important的CSS样式声明的优先级最高;内嵌样式次之;最后按照样式表中的声明顺序(id选择器优先级最高，class选择器次之，HTML标签优先级最低)。如果没有设置样式，则自动继承父级节点的样式。
5. td[name="red"]{color:red}表示将td标签中name属性的值为red的目标元素的字体颜色设置为红色。
6. 通过z-index属性来设置图片的层叠效果，z-index的值越大的元素，越靠近上层。
7. 不同元素的class的值可以相同，但不同元素的id的值必须不同，id的值具有唯一性。
8. 超链接元素a的伪类选择符有:link, visited, active, hover。出现的顺序必须为link, visited, hover, active。a:hover{background-color:red;cursor:pointer;}表示当鼠标移到a元素上时，将改变a元素的背景色和鼠标指针的样式，鼠标移下来则恢复原来的样式。
9. table td, div.sub a, ul>li{font-size:14px;}表示将下面三个元素的字体设置为14px，三个元素分别为:
   table元素里面的td元素;
   class的值为sub的div元素里面的a元素;
   ul元素的直接子元素li。
   注意:若li为ul的祖孙元素，而非直接子元素，则不能写成ul>li，应该写成ul li，可以看出后者的通用性更强。
10. p#sub和p #sub的区别:
    p#sub表示id的值为sub的p标签;
    p #sub表示p标签里面id的值为sub的元素。
11. input:focus{background-color:red;}表示当input元素成为焦点时，该元素的背景色变为红色，失去焦点时恢复原来的样式。
12. h1:before{content:"<";}
    h1:after{content:">";}
    上面两句表示在标签h1的前面加上<，在标签h1的后面加上>。
    注意:伪元素:before和:after都需要和content属性一起使用。
13. letter-spacing属性用于设定字符间距;
    word-spacing属性用于设定单词间距;
    line-height属性用于设定行高。