text-align: center的作用是什么,作用在什么元素上?能讓什么元素水平居中
center的作用:對塊狀元素中的行內(nèi)元素(文本锰扶、span、dt)起作用寝受,居中是塊狀元素里面的元素居中坷牛,并不是塊狀元素居中。
IE 盒模型和W3C盒模型有什么區(qū)別?
標準盒模型的范圍包括margin羡蛾、border漓帅、padding、content痴怨,并且content部分不包含其他部分忙干。
width:margin2+border2+padding2+width;
height:margin2+border2+padding2+height;
IE 盒子模型的范圍也包括 margin、border浪藻、padding捐迫、content,和標準 W3C 盒子模型不同的是:IE 盒子模型的 content 部分包含了 border 和 pading爱葵。
width:margin+border+padding+width;
ie中content的寬度包括padding和border這兩個屬性施戴;
*{ box-sizing: border-box;}的作用是什么?
塊級元素實際所占寬高度=外邊距(margin)+邊界寬度(border-width)+內(nèi)邊距(padding)+高度(height)/寬度(width)萌丈;
如果設置了border-box赞哗,實際所占的寬高度=設置的高度(height)/ 設置的寬度(width)+ 外邊距(margin);
一般在寫頁面的時候用這個屬性就不會再考慮邊框和內(nèi)邊距會改變整體所占寬度辆雾,即不用再根據(jù)盒子模型再去計算肪笋,省去很多麻煩。
line-height: 2和line-height: 200%有什么區(qū)別?
- line-height:2 是指行高是盒子模型里的content的兩倍行高
- line-height:200%是指行高是父元素的行高的兩倍
inline-block有什么特性?如何去除縫隙藤乙?高度不一樣的inline-block元素如何頂端對齊?
inline-block 既呈現(xiàn) Inline 特性(不占據(jù)一整行猜揪,寬度由內(nèi)容寬度決定)又呈現(xiàn)block特性(可設置寬度高,內(nèi)外邊距)
兩段span中間的空隙去掉變成一行坛梁,不要留出空白字符
.wrap{front-size:0;}
高度不一樣的inline-block元素如何頂端對齊?
vertical-align:top;
CSS sprite 是什么?
指將不同的圖片/圖標合并到一張圖片上而姐。
使用css sprite可以減少網(wǎng)絡請求,提高網(wǎng)頁加載性能
讓一個元素"看不見"有幾種方式划咐?有什么區(qū)別?
opacity: 0 ; 透明度為0拴念,整體
visibility: hidden; 和opacity:0 類似
display:none; 消失,不占用位置
background-color: rgba(0尖殃,0丈莺,0划煮,0.2)只是背景色透明
編碼1.
編碼2.