1,text-align: center的作用是什么,作用在什么元素上?能讓什么元素水平居中?
- text-align:center的意思是塊級元素中的行內內容居中。
作用在block-level元素上(包括了block和inline-block),能讓作用這行里的字體水平居中
2,IE盒模型和W3C盒模型有什么區別?
- IE盒模型width包括centent+padding+border。
- W3C標準盒模型width知識centent,不包括padding和border。
3,*{ box-sizing: border-box;}的作用是什么?
- box-sizing是CSS3新樣式。對當前頁面所有元素使用IE盒模型。另外的,"content-box"為W3C盒模型。
4,line-height: 2和ling-height: 200%有什么區別?
- ine-height: 2 表示設置當前元素內的字體行間距為自身字體大小的兩倍(為先繼承,在換算成px。)
- line-height: 200% 表示設置當前元素內的字體行間距為相對于其父元素的字體行間距的兩倍(是先換算成px,子元素在繼承)
5,inline-block有什么特性?如何去除縫隙?高度不一樣的inline-block元素如何頂端對齊?
1,即呈現inline特性(不占據一整行,寬度由內容決定),又呈現block特性(可以設置寬高,內外邊距)。使其既具有block的寬度高度特性又具有inline的同行特性。
2,去除縫隙是把兩個元素中間的空白符刪除,讓其兩個元素相連。
3,vertical-align: top;能夠讓不一樣的inline-block元素頂端對齊。
6,CSS sprite是什么?
是將不同的圖片/圖標組合到一張圖片上。
使用CSS sprite 可以減少網絡請求,提高網頁加載速度。
7,讓一個元素'看不見'有幾種方式,有什么區別?
- display: none ;消失,不占用位置。
- visibility:和opacity:0;類似。隱藏透明。但是占用位置。
- opacity:0;透明度為0,整體。
- background-color:rgba(0,0,0,0.2);只是背景色透明。
8,代碼
http://js.jirengu.com/katesehibe/1/edit?html,css,output