text-align: center的作用是什么裸燎,作用在什么元素上?能讓什么元素水平居中
- text-align:center定義行內(nèi)內(nèi)容(如文字)相對他的塊父元素居中對齊
- 設(shè)置在塊級元素上
- 讓在塊級父元素內(nèi)的行內(nèi)元素水平和inline-block元素居中
IE盒模型和W3C盒模型有什么區(qū)別?
IE盒模型和W3C盒模型的區(qū)別就是計算寬高的方法不同
- IE盒模型里的寬度=內(nèi)容寬度+左右padding值+左右border值+左右margin值
IE盒模型里的高度=內(nèi)容高度+上下padding值+上下border值+上下margin值 - 3C盒模型里的寬高就等于內(nèi)容寬高
*{ box-sizing: border-box;}的作用是什么泼疑?
將所有元素的盒模型轉(zhuǎn)化為IE盒模型
line-height: 2和line-height: 200%有什么區(qū)別?
區(qū)別體驗在子元素的繼承上
- line-height: 2指的是本身文字高度的兩倍德绿,父元素設(shè)置line-height:2會直接繼承給子元素,子元素根據(jù)自己的font-size再去計算子元素自己的line-height退渗。
- line-height: 200%;指的是父容器文字高度的兩倍移稳,父元素設(shè)置line-height:200%是計算好了line-height值,然后把這個計算值給子元素繼承会油,子元素繼承拿到的就是最終的值了个粱。此時子元素設(shè)置font-size就對其line-height無影響了。
inline-block有什么特性钞啸?如何去除縫隙几蜻?高度不一樣的inline-block元素如何頂端對齊?
- display:inline-block特性:不獨占一行,可以設(shè)置寬高和四個方向的marign和padding
- 去除縫隙
1.設(shè)置其父元素的字體為0,在設(shè)置自身的字體大小
2.元素標(biāo)簽之間不能有換行和空格
3.設(shè)置浮動 - 頂端對齊:給元素設(shè)置 vertical-align:top
CSS sprite 是什么?
CSS sprite 是圖片精靈,就是盡可能把網(wǎng)頁上的多個圖片整合到一張圖片上体斩,利用background-position定位來使用,這樣做可以減少http請求,減少圖片的字節(jié),節(jié)省流量,提高重用性.
讓一個元素"看不見"有幾種方式?有什么區(qū)別?
- display:none 不占位置
- opacity: 0 元素透明度為0颖低,還占有位置
- visibility: hidden:與opacity: 0類似
- background-color: rgba(0,0,0,0):背景色透明
- text-indent: 99999px 首行左縮進到人看不到的地方 其實還在