-
text-align: center的作用是什么导街，作用在什么元素上？能讓什么元素水平居中款票？
text-align:center能讓文本內(nèi)容居中泽论，作用在塊元素上，能讓塊元素中的行內(nèi)元素居中佩厚，是可繼承的屬性。
-
IE盒模型和W3C盒模型有什么區(qū)別?
IE盒模型與w3c盒模型的區(qū)別在于width和height的定義不一樣：
IE盒模型的width包括了content潮瓶、padding钙姊、border的寬度，height包括content煞额、padding沾谜、border的高度胀莹；
w3c盒模型的width和height僅僅指content的寬度和高度。
-
*{ box-sizing: border-box;}的作用是什么媳否？
在默認(rèn)情況下荆秦，一個(gè)塊元素的盒模型為標(biāo)準(zhǔn)盒模型，可以通過(guò)*{ box-sizing: border-box;}屬性把盒模型變?yōu)閕e盒模型掺逼。
-
line-height: 2和line-height: 200%有什么區(qū)別?
line-height: 2 表示元素的行高是其自己字體大小的2倍瓤介；
line-height: 200% 表示元素的行高是其父元素字體大小的2倍。
-
inline-block有什么特性惑朦？如何去除縫隙？高度不一樣的inline-block元素如何頂端對(duì)齊?
inline-block可以使一個(gè)元素既有inline（不占據(jù)一整行病梢，寬度由內(nèi)容寬度決定）的特性梁肿，也有block（占據(jù)一整行，可設(shè)置寬高和內(nèi)外邊距）的特性吩蔑；
當(dāng)兩個(gè)元素被賦予inline-block時(shí)，兩個(gè)元素之間可能會(huì)出現(xiàn)縫隙:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JS Bin</title>
<style rel="stylesheet" type="text/css">
.test {
text-align:center;
}
.aa,.bb {
display: inline-block;
border: 1px solid;
width: 100px;
}
</style>
</head>
<body>
<div class="test">
<span class="aa">aa</span>
<span class="bb">bb</span>
</div>
</body>
</html>
實(shí)現(xiàn)如下：
這是由于兩個(gè)元素之間存在空白符造成，故可以用以下辦法解決：
1.元素連寫(xiě)赘娄，不換行；
2.在css中設(shè)置父元素字體高度為0px性置，再在后面設(shè)置具體元素字高：
body {
text-align: center;
}
.test {
font-size: 0;
}
.aa,.bb {
display: inline-block;
border: 1px solid;
width: 100px;
font-size: 14px;
}
-
CSS sprite 是什么?
css sprite稱(chēng)為精靈圖或雪碧圖揍堰，是處理網(wǎng)頁(yè)icon（小圖標(biāo)）的一種方式嗅义。把所有的icon整合到一張圖片上隐砸，通過(guò)css進(jìn)行背景定位，展現(xiàn)小圖標(biāo)的一種方法继控。這種方法減少網(wǎng)頁(yè)請(qǐng)求械馆，減少了服務(wù)器的壓力，提高的頁(yè)面的展現(xiàn)速度珊搀，但是缺點(diǎn)是無(wú)法調(diào)整圖片大小尾菇，修改困難。
-
讓一個(gè)元素"看不見(jiàn)"有幾種方式派诬？有什么區(qū)別?
1.display:none 使一個(gè)元素消失，瀏覽器不會(huì)繪制該元素沛鸵，不占用位置缆八；
2.opacity: 0 使一個(gè)元素透明，用戶(hù)看不見(jiàn)奈辰，但是實(shí)際還在，占用位置吊趾；
3.visibility: hidden 與opacity: 0 作用類(lèi)似瑟啃；
4.background-color: rgba(0，0翰守，0，0.2) 使背景色透明了袁。
