text-align: center的作用是什么,作用在什么元素上?能讓什么元素水平居中?
text-align可以使文本居中對齊,作用在行內(nèi)元素上,如果是給父元素是塊級元素的元素設(shè)置text-align:center,可以使包裹在父元素里的行內(nèi)元素水平居中。
IE 盒模型和W3C盒模型有什么區(qū)別?
IE盒模型:
css的width=(border+padding)*2
+Content
整個盒模型寬=(border+padding)*2
+Content+margin*2
** W3C盒模型: **
css的width=Content
整個盒模型寬=Content+(padding+border+margin)*2
高同理。
*{ box-sizing: border-box;}的作用是什么?
為元素設(shè)定的寬度和高度決定了元素的邊框盒。
就是說,為元素指定的任何內(nèi)邊距和邊框都將在已設(shè)定的寬度和高度內(nèi)進(jìn)行繪制。
通過從已設(shè)定的寬度和高度分別減去邊框和內(nèi)邊距才能得到內(nèi)容的寬度和高度。
line-height: 2和line-height: 200%有什么區(qū)別?
line-height:2表示的是行高是本身字體像素的2倍。
line-height:200%表示的是行高是父容器行高的2倍。
inline-block有什么特性?如何去除縫隙?高度不一樣的inline-block元素如何頂端對齊?
inline-block既有inline的屬性又有block的屬性,比如行內(nèi)元素設(shè)置成inline-block之后可以是它排在同一行,又可以設(shè)置寬高和邊距。
排在一行的元素去除縫隙有三種方法:
1.將它們之間的空格去掉,也就是標(biāo)簽緊密排在一起。如:
2.給父容器設(shè)置font-size:0;給行內(nèi)元素單獨(dú)設(shè)置font-size。
3.如果是行內(nèi)元素,就設(shè)置display:block,用浮動也可以去除縫隙。
設(shè)置vertical-align:top可以使inline-block元素頂端對齊。
CSS sprite 是什么?
CSS prites在國內(nèi)很多人叫css精靈,是一種通過CSS技術(shù)將原本需要多張圖像文件分別顯示,整并為單一圖像文件的分區(qū)顯示技術(shù),借由減少下載圖像文件數(shù)量,提高網(wǎng)頁的顯示性能。
讓一個元素"看不見"有幾種方式?有什么區(qū)別?
1.opacity:0 透明度為0,就相當(dāng)于看不見了
2.visibility:hidden
3.display:none
4.background-color:rgba(0,0,0,.2)只是背景色透明。
1、2、4看不見后還是占有文檔流空間。3隱藏之后就不占用文檔流了。