span与div用法相同，只不过是内联的，div是成块的。

选择子孙的办法：

<div id="elixir"></div>  //假如它的子孙中包含<h2>
#elixir h2{color:black;}     //就是将它的子孙中所有的h2都设置黑色。
#elixir>h2{color:black;}   //是选择div的“直接子孙”，不再向下层嵌套。
#elixir blockquote h2{}     //是选择div子孙中的blockquote中的h2。

text-align: center;          //使div中所有的内联元素居中，包括图片，文字。

来点快捷方式：

padding-top:       0px
padding-right:     20px       
padding-bottom: 30px
padding-left:       10px
简写：
padding：0px 20px 30px 10px；按照上右下左的顺序。
margin同理。

若四边相同可简写padding：20px；
若上下相同，左右相同，可简写padding： 20px 30px；

background-color:white;
background-image:url(images/apple.gif);
background-repeat:repeat-x;
简写：background： white url（images/apple.gif） repeat-x;

字体的简写有些要求：

font: font-style font-variant font-weight font-size/line-height font-family//其中前三项和第五项可以省略。

连接的几种状态：

a:link{color:green;}          //未点击。
a:visited{color:yellow;}    //点击后。
a:hover{color:red;}           //悬停。
还有focus和active状态。
设置时按照这个顺序来设置。

伪类：

如上面所说的link，visited等等，没有在html文件中填写过这样的类，但是他们是浏览器默认的类，未点击时属于link，点击后，属于visited。

QQ20160426-0@2x.png

QQ20160426-1@2x.png