块级元素和行内元素
- 块级（block-level）；行内(内联、inline-level)
- 块级元素可以包含块级和行内，行内只能包含文本和行内（a标签除外）
- 块级占据整行空间，行内占据自身宽度空间
- 宽高设置、内外边距的差异
block-level
div h1~6 p hr form
ul dl ol pre table
li dd dt tr td th
inline-level
em strong span a br img
button input lable select textarea
code script
宽高
只对块级元素生效，对行内元素设置无效
边框
border-width
border-color
border-style
边距
padding
margin
- 对于块级元素设置margin:0 auto可以实现水平居中
display
inline | block | list-item | inline-block | table | none | inherit
font
font-size
font-family
font-weight
line-height
// 以上属性都可以继承给子元素
font: 12px/1.5 tahoma,arial; //1.5是line-height
浏览器默认字体大小16px；中文版chrome最小字体12px
文本
- text-align: left | center | right | justify
- text-indent: 文案第一行缩进距离
- text-decoration: none | underline | - line-through | overline
- color
- text-transform: 改变文字大小写 none | uppercase | lowercase | capitalize
- word-spacing: 可以改变字（单词）间的标准间隔
- letter-spacing: 字母间隔，修改的是字符或字母之间的间隔
颜色
单位
- px
- 百分比
width: 50% ; //相对父宽度
- em：相对单位，相对于父元素字体大小
- rem：相对单位，相对于根元素（html）字体大小
- vw vh：相对单位，1vw为屏幕宽度的1%（兼容性https://caniuse.com/#search=vw）
