②作為外部 wrapper 的 div 不要定死高度,為了讓高度能自動(dòng)適應(yīng)，要在wrapper里面加上overflow:hidden; 當(dāng)包含float的box的時(shí)候，高度自動(dòng)適應(yīng)在IE下無效，這時(shí)候應(yīng)該觸發(fā)IE的layout私有屬性(萬惡的IE啊！)用zoom:1;可以做到，這樣就達(dá)到了兼容。
例如某一個(gè)wrapper如下定義：
.colwrapper{ overflow:hidden; zoom:1; margin:5px auto;}
�、蹖�(duì)于排版,我們用得最多的css描述可能就是float:left.有的時(shí)候我們需要在n欄的float div后面做一個(gè)統(tǒng)一的背景,譬如:
＜div id=”page”>
＜div id=”left”>＜/div>
＜div id=”center”>＜/div>
＜div id=”right”>＜/div>
＜/div>
比如我們要將page的背景設(shè)置成藍(lán)色,以達(dá)到所有三欄的背景顏色是藍(lán)色的目的,但是我們會(huì)發(fā)現(xiàn)隨著left center right的向下拉長(zhǎng),而page居然保存高度不變,問題來了,原因在于page不是float屬性,而我們的page由于要居中,不能設(shè)置成 float,所以我們應(yīng)該這樣解決
＜div id=”page”>
＜div id=”bg” style=”float:left;width:100%”>
＜div id=”left”>＜/div>
＜div id=”center”>＜/div>
＜div id=”right”>＜/div>
＜/div>
＜/div>
再嵌入一個(gè)float left而寬度是100%的DIV解決之
�、苋f能float 閉合(非常重要!)
關(guān)于 clear float 的原理可參見 [How To Clear Floats Without Structural Markup],將以下代碼加入Global CSS 中,給需要閉合的div加上 class="clearfix" 即可,屢試不爽.
/* Clear Fix */
.clearfix:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }
.clearfix { display:inline-block; }
/* Hide from IE Mac */
.clearfix {display:block;}
/* End hide from IE Mac */
/* end of clearfix */
或者這樣設(shè)置：.hackbox{ display:table; //將對(duì)象作為塊元素級(jí)的表格顯示}
�。梗叨炔贿m應(yīng)
高度不適應(yīng)是當(dāng)內(nèi)層對(duì)象的高度發(fā)生變化時(shí)外層高度不能自動(dòng)進(jìn)行調(diào)節(jié)，特別是當(dāng)內(nèi)層對(duì)象使用margin 或paddign 時(shí)。
例：
#box {background-color:#eee; }
#box p {margin-top: 20px;margin-bottom: 20px; text-align:center; }
＜div id="box">
＜p>p對(duì)象中的內(nèi)容＜/p>
＜/div>
解決方法：在P對(duì)象上下各加2個(gè)空的div對(duì)象CSS代碼：.1{height:0px;overflow:hidden;}或者為DIV加上border屬性。
10 .IE6下為什么圖片下有空隙產(chǎn)生
解決這個(gè)BUG的方法也有很多,可以是改變html的排版,或者設(shè)置img 為display:block 或者設(shè)置vertical-align 屬性為vertical-align:top bottom middle text-bottom 都可以解決.
11.如何對(duì)齊文本與文本輸入框
加上 vertical-align:middle;
＜style type="text/css">
＜!--
input {
width:200px;
height:30px;
border:1px solid red;
vertical-align:middle;
}
-->
＜/style>
12.web標(biāo)準(zhǔn)中定義id與class有什么區(qū)別嗎
一.web標(biāo)準(zhǔn)中是不容許重復(fù)ID的,比如 div id="aa" 不容許重復(fù)2次,而class 定義的是類,理論上可以無限重復(fù), 這樣需要多次引用的定義便可以使用他.
二.屬性的優(yōu)先級(jí)問題
ID 的優(yōu)先級(jí)要高于class,看上面的例子
三.方便JS等客戶端腳本,如果在頁面中要對(duì)某個(gè)對(duì)象進(jìn)行腳本操作,那么可以給他定義一個(gè)ID,否則只能利用遍歷頁面元素加上指定特定屬性來找到它,這是相對(duì)浪費(fèi)時(shí)間資源,遠(yuǎn)遠(yuǎn)不如一個(gè)ID來得簡(jiǎn)單.
13. LI中內(nèi)容超過長(zhǎng)度后以省略號(hào)顯示的方法
此方法適用與IE與OP瀏覽器
＜style type="text/css">
＜!--
li {
width:200px;
white-space:nowrap;
text-overflow:ellipsis;
-o-text-overflow:ellipsis;
overflow: hidden;
}
-->
＜/style>
14.為什么web標(biāo)準(zhǔn)中IE無法設(shè)置滾動(dòng)條顏色了 本新聞共 5頁,當(dāng)前在第 2頁 1 2 3 4 5 |
