說一說CSS尺寸設(shè)置的單位?
得分點(diǎn):px、rem、em、vw、vh。
回答:px:pixel像素的縮寫,絕對長度單位,它的大小取決于屏幕的分辨率,是開發(fā)網(wǎng)頁中常常使用的單位。
????em:相對長度單位,在font-size中使用是相對于父元素的字體大小,在其他屬性中使用是相對于自身的字體大小,如width;如當(dāng)前元素的字體尺寸未設(shè)置,由于字體大小可繼承的原因,可逐級向上查找,最終找不到則相對于瀏覽器默認(rèn)字體大小。
????rem:相對長度單位,相對于根元素的字體大小,根元素字體大小未設(shè)置,使用瀏覽器默認(rèn)字體大小。
????vw:相對長度單位,相對于視窗寬度的1%。
????vh:相對長度單位,相對于視窗高度的1%。
加分回答:rem應(yīng)用:在移動(dòng)端網(wǎng)頁開發(fā)中,頁面要做成響應(yīng)式的,可使用rem配合媒體查詢或者flexible.js實(shí)現(xiàn)。
????原理:通過媒體查詢或者flexible.js,能夠在屏幕尺寸發(fā)生改變時(shí),重置html根元素的字體大小,頁面中的元素都是使用rem為單位設(shè)置的尺寸,因此只要改變根部元素字體大小,頁面中的其他元素尺寸就自動(dòng)跟著修改。
????vw應(yīng)用:由于vw被更多瀏覽器兼容之后,在做移動(dòng)端響應(yīng)式頁面時(shí),通常使用vw配合rem。
????原理:使用vw設(shè)置根元素html字體的大小,當(dāng)窗口大小發(fā)生改變,vw代表的尺寸就跟著修改,無需加入媒體查詢和flexible.js,頁面中的其他元素仍使用rem為單位,就可以實(shí)現(xiàn)響應(yīng)式。