圖片選項卡
- 從大到小
- 從外到裏
- 從簡單到複雜
學習技巧
- what 是什麼
- when 什麼時候用
- where 什麼地方
- how 怎麼用
dispaly
- block 塊級元素
- div h p ul li
- 獨佔一行
- 支持寬高
- 沒有設置寬度的時候 默認寬度爲父級100%
- 支持margin padding 支持css樣式
- inline 行內元素
- span a em
- 默認由內容撐開寬高
- 排成一行
- 不支持設置寬度 高度
- 不支持垂直方向的margin 支持左右margin
- padding的使用會出現詭異的情況 會把其他的樣式遮掩住
- 空格被解析了一次 要去掉空格：a 不要留空格 b 父級字體大小設置爲0，自身設置字體大小 c設加註釋置浮動 d
- inline-block 行內塊
- 支持寬高 可以排成一行
- 沒有設置寬度高度的時候 默認內容撐開寬度
- 空格會被解析
- 不支持margin:auto 支持margin padding
- 在一行內 padding會影響其他元素的高度 但是不會遮住其他樣式
轉換類型
- 行內樣式可轉變爲塊級元素
- 塊級元素可轉換爲行內元素
- 三個元素可互相轉換