1. 布局定位 属性： display / position / float / clear / visibility / overflow （建议 display 第一个写，毕竟关系到模式）
2. 自身 属性： width / height / margin / padding / border / background
3. 文本 属性： color / font / text-decoration / text-align / vertical-align / white- space / break-word
4. 其他属性（CSS3）：content / cursor / border-radius / box-shadow / text-shadow / background:linear-gradient…
.box {
//布局定位
display: block;
position: relative;
float: left;
//自身属性
width: 100px;
height: 100px;
margin: 0 10px;
padding: 20px 0;
//文本属性
font-family: Arial, ‘Helvetica Neue’, Helvetica, sans-serif;
color: #333;
//css3
background: rgba(0,0,0,.5);
border-radius: 10px;
}
导航栏
实际开发中，我们不会直接用链接a 而是用 li 包含链接(li+a)的做法。
1. li+a 语义更清晰，一看这就是有条理的列表型内容。
2. 如果直接用a，搜索引擎容易辨别为有堆砌关键字嫌疑（故意堆砌关键字容易被搜索引擎有降权的风险）， 从而影响网站排名
注意:
1. 让导航栏一行显示, 给 li 加浮动, 因为 li 是块级元素, 需要一行显示.
2. 这个nav导航栏可以不给宽度,将来可以继续添加其余文字
3. 因为导航栏里面文字不一样多,所以最好给链接 a 左右padding 撑开盒子,而不是指定宽度