1 css常识

1 命名

我建议采用完全小写的类名和ID，多个单词之间用 – 连接。比如：andy-budd比andyBudd清晰得多。

2 ID和类选择器

id选择器格式：

#para1 {
    text-align:center;
    color:red;
}

class选择器：

.center {
    text-align:center;
}

3 DTD和DOCTYPE

DTD：document type definition，定义HTML的特定版本中允许有什么，不允许有什么，浏览器通过这些规则检查页面的有效性。是一组机器可读的规则。

DOCTYPE：声明使用哪个DTD，浏览器由此知道使用哪个HTML版本。

DTD：document type definition，定义HTML的特定版本中允许有什么，不允许有什么，浏览器通过这些规则检查页面的有效性。是一组机器可读的规则。

DOCTYPE：声明使用哪个DTD，浏览器由此知道使用哪个HTML版本。

和混杂模式对应的是标准模式。

4 常用选择器

元素选择器：         p {}

后代选择器：         div p {}

ID选择器：             #demo {}

Class选择器：        .demo {}

用这四种选择器就能定位很多很多元素了。

5 特殊性 - 优先级

6 外部样式

7 display

display: none;

display: inline;

display: block;

display: inline-block;

display: flex

8 定位

 9 浮动

浮动，顾名思义，就是浮上来，不再占据文档流的空间，但有一种情况例外，就是当图片浮动时，依旧会影响它周围文字的布局。

10 清除浮动

section.two:after {
    content: '.';
    height: 0;
    visibility: hidden;
    display: block;
    clear: both;
}

注意：只有块元素，clear之后才会create enough vertical space

所以要设置为display: block;