1.內(nèi)聯(lián)元素如何轉(zhuǎn)化成為塊元素？
讓內(nèi)聯(lián)元素產(chǎn)生浮動或者將它的display屬性值設(shè)置為block即可。
display:block ; 顯示為塊，使內(nèi)聯(lián)元素具備塊屬性標(biāo)簽的特性
2.元素類型有哪些？他們的特征分別是什么？
塊元素：display:block ;
1.沒有設(shè)置寬度時，默認(rèn)撐滿一行。
2.默認(rèn)塊元素獨占一行。
3.支持所有CSS命令。
內(nèi)聯(lián)元素：display:inline;
1.寬高由內(nèi)容撐開。
2.不支持寬高。
3.一行內(nèi)可以繼續(xù)顯示跟同類的標(biāo)簽。
4.不支持上下的margin。
5.代碼換行被解析。
內(nèi)聯(lián)塊元素：display:inlineblock;
1、塊元素能在一行顯示。
2、內(nèi)聯(lián)元素支持寬高。
3、沒有寬度的時候由內(nèi)容撐開寬度。
3.清除浮動有哪些方式？你最喜歡哪一種？為什么？
clear
clear:left （左）right （右）both （左右兩邊）none （沒有）inherit （繼承）；元素的某個方向上不能有浮動元素
clear:both; 在左右兩側(cè)均不允許有浮動元素。
加高度
問題：高度不定時不方便清除，擴(kuò)展性不好。
父級浮動
問題：頁面中所有元素都加浮動，margin左右auto失效（floats bad ！）
inline-block 清浮動方法：
問題：margin左右auto失效；
空標(biāo)簽清除浮動
問題：IE6 最小高度 19px；（解決后IE6下還有2px偏差）
br清除浮動 <br clear="all"/>
問題：不符合工作中：結(jié)構(gòu)、樣式、行為，三者分離的要求。
after偽類清除浮動方法 給浮動元素的父級加after偽類
after偽類： 元素內(nèi)部末尾添加內(nèi)容；
after{content"添加的內(nèi)容";} IE6，7下不兼容
zoom 縮放
a.觸發(fā) IE下 haslayout，使元素根據(jù)自身內(nèi)容計算寬高。
b.FF 不支持；
clear:after{content:'';display:block;clear:both;}
clear{zoom:1;}
overflow:hidden 清浮動方法；給浮動元素的父級加overflow
問題：需要配合 寬度 或者 zoom 兼容IE6 IE7；
overflow: scroll | auto | hidden；
overflow:hidden;溢出隱藏（裁刀！）（超出父級隱藏）
overflow:scroll;（超出父級有滾動條）
本人喜歡overflow:hidden 清浮動方法：雖然此方法有一定的局限性，不過overflow:scroll;這條命令比較人性化。每個方法都需要學(xué)習(xí)，具體環(huán)境具體考慮。
4.什么是BFC？如何才能得到一個BFC?
BFC (block formatting context) 塊格式化上下文 標(biāo)準(zhǔn)瀏覽器
a.float的值不為none。
b.overflow的值不為visible。
c.display的值為table-cell, table-caption, inline-block中的任何一個。
d.position的值不為relative和static。
e.width|height|min-width|min-height:(!aotu)
5.Postion的值有哪些？
position:relative | absolute | fixed | static | inherit;
position:absolute; 絕對定位
position:fixed; 固定定位
position:static ; 默認(rèn)值
position:inherit ; 從父元素繼承定位屬性的值 (不兼容)
position:relative; 相對定位
6.說一下絕對定位、相對定位和固定定位的區(qū)別？
position:relative; 相對定位
*需要誰移動就給誰加定位
a.不影響元素本身的特性；
b.不使元素脫離文檔流（元素移動之后原始位置會被保留）；
c.如果沒有定位偏移量，對元素本身沒有任何影響；
d.提升層級
定位元素位置控制
top/right/bottom/left （上 右 下 左）定位元素偏移量。
top:200px; 上部留有200px。
left:200px; 左側(cè)留有200px。
position:absolute; 絕對定位
a、使元素完全脫離文檔流（元素移動之后原始位置不會被保留）；
b、使內(nèi)嵌支持寬高；
c、塊屬性標(biāo)簽內(nèi)容撐開寬度；
d、如果有定位父級相對于定位父級發(fā)生偏移，沒有定位父級相對于document（瀏覽器可視區(qū)域的）發(fā)生偏移；
e、相對定位一般都是配合絕對定位元素使用；
f、提升層級
position:fixed； 固定定位
與絕對定位的特性基本一致，差別是始終相對整個文檔（瀏覽器可視區(qū)域的）進(jìn)行定位；問題：IE6不支持固定定位；
position:fixed;
right:0; 可直接定位方向
bottom:0;
7.怎么改變一個div的層級，寫出代碼讓div1在div2下。
代碼從上往下執(zhí)行，后面的能覆蓋前面的，定位元素默認(rèn)后者層級高于前者；改變兄弟標(biāo)簽之間層級最好用z-index:number;來定位層級。為了讓div1在div2后執(zhí)行，需要提升div1的等級，代碼如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標(biāo)題文檔</title>
<style>
body{margin:0;}
#div1{width:50px;height:50px;background:red;position:absolute;z-index:1;top:50px;}
#div2{width:50px;height:50px;background:yellow; position:relative;}
</style>
</head>
<body>
<div id="div1">div1</div>
<div id="div2">div2</div>
</body>
</html>
8.如何實現(xiàn)層疊的div1與div2，上面div1不透明下面div2透明？
標(biāo)準(zhǔn)瀏覽器透明度設(shè)置： opacity:0~1; （完全透明~不透明）
父級加透明度子級也會被繼承。
IE瀏覽器6.7下的透明度設(shè)置： filter:alpha(opacity=0~100); （完全透明~不透明）
代碼如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標(biāo)題文檔</title>
<style>
#div1{width:100px;height:100px;background:red;position:absolute;z-index:1;}
#div2{width:100px;height:100px;background:black; position:absolute;top:20px;left:20px;opacity:0.5;}
</style>
</head>
<body>
<div id="div1">div1</div>
<div id="div2">div2</div>
</body>
</html
9.合并行屬性，合并列屬性
colspan 屬性規(guī)定單元格可橫跨的列數(shù)。
<td colspan="2"></td> 合并兩個單元格
rowspan 屬性規(guī)定單元格可橫跨的行數(shù)。
<td rowspan="2"></td> 合并兩個單元格
合并的數(shù)量+剩余的數(shù)量=總數(shù)
一行合并刪當(dāng)前行，跨行合并刪除當(dāng)前行的其他行。
10.讓div水平垂直居中
margin:50%;
