塊級(jí)元素和行內(nèi)元素

• 塊級(jí)（block-level）；行內(nèi)(內(nèi)聯(lián)、inline-level)
• 塊級(jí)元素可以包含塊級(jí)和行內(nèi)，行內(nèi)只能包含文本和行內(nèi)（a標(biāo)簽除外）
• 塊級(jí)占據(jù)整行空間，行內(nèi)占據(jù)自身寬度空間
• 寬高設(shè)置、內(nèi)外邊距的差異

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

寬高

只對(duì)塊級(jí)元素生效，對(duì)行內(nèi)元素設(shè)置無效

邊框

border-width
border-color
border-style

邊距

padding
margin

• 對(duì)于塊級(jí)元素設(shè)置margin:0 auto可以實(shí)現(xiàn)水平居中

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

瀏覽器默認(rèn)字體大小16px；中文版chrome最小字體12px

文本

• text-align: left | center | right | justify
• text-indent: 文案第一行縮進(jìn)距離
• text-decoration: none | underline | - line-through | overline
• color
• text-transform: 改變文字大小寫 none | uppercase | lowercase | capitalize
• word-spacing: 可以改變字（單詞）間的標(biāo)準(zhǔn)間隔
• letter-spacing: 字母間隔，修改的是字符或字母之間的間隔

顏色

單位

• px
• 百分比

width: 50% ; //相對(duì)父寬度

• em：相對(duì)單位，相對(duì)于父元素字體大小
• rem：相對(duì)單位，相對(duì)于根元素（html）字體大小
• vw vh：相對(duì)單位，1vw為屏幕寬度的1%（兼容性https://caniuse.com/#search=vw）