1、元素的margin的top厢塘、bottom及padding的top茶没、bottom使用百分比作為單位時(shí)，其是相對父元素的寬度width的而不是我們想象的高度height晚碾；
- 拓展應(yīng)用需要實(shí)現(xiàn)如下的不急抓半，圖片加載是需要時(shí)間的，加載完成前圖片的占位高度為0格嘁，所以一般我們都給他定死寬高（pc）笛求；但是在移動端，由于各機(jī)型分辨率相差太大，寫死px是絕對不可能的探入，終究還得靠百分比來實(shí)現(xiàn)自適應(yīng)：其實(shí)出現(xiàn)這種現(xiàn)象狡孔，我們可以巧用margin/padding的百分比值實(shí)現(xiàn)高度自適應(yīng)（多用于占位，避免閃爍）
CM0E7LERRX@_4T9(GNF`TO2.png
2.寬度繼承問題---- width：100%
當(dāng)父容器里有 絕對定位 的子元素時(shí)新症，子元素設(shè)置width:100%實(shí)際上指的是相對于父容器的padding+content的寬度步氏。當(dāng)子元素是非絕對定位的元素時(shí)width:100%才是指子元素的 content ，其等于父元素的 content寬度徒爹。
3.font的縮寫
body {
font: font-style font-variant font-weight font-size line-height font-family;
}
//如下代碼可以簡寫
body {
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
font-weight: normal;
font-variant: small-caps;
font-style: italic;
line-height: 150%;
}
body {
font: italic small-caps normal 13px/150% Arial, Helvetica, sans-serif;
}
4.css的優(yōu)先級
- 基本規(guī)則是： 行內(nèi)樣式 > id樣式 > class樣式 > 標(biāo)簽名樣式
example:
``
5.currentColor ie9+
currentColor關(guān)鍵字代表原始的 color 屬性的計(jì)算值荚醒。它允許讓繼承自屬性或子元素的屬性顏色屬性以默認(rèn)值不再繼承。它也能用于那些繼承了元素的 color
屬性計(jì)算值的屬性隆嗅，相當(dāng)于在這些元素上使用 inherit關(guān)鍵字界阁，如果這些元素有該關(guān)鍵字的話。
currentColor-CSS3超高校級好用CSS變量
TOQB{_R%6X0)%YY`~Z_KO5Q.png
圖片發(fā)自簡書App
6.怎么實(shí)現(xiàn)除了第一行的縮進(jìn)
image.png
image.png
7.你不一定了解的var
大家肯定都知道var javascript弱類型聲明變量用的胖喳，看下面的寫法泡躯。
:root {
--1: blue;
}
body {
background-color: var(--1);
}
css 也能用var？這不像是sass丽焊，less啊较剃，對你沒看錯(cuò)這個(gè)是原生的css寫法。兼容性目前比較差技健，ie不支持写穴。有興趣可以去看下張鑫旭的css，css3原生var變量
css var兼容性.png
