divcss兼容性問(wèn)題-在線瀏覽
2024-07-18 13:35本頁(yè)面
【正文】 直正確。為了讓這一命令 在IE上也能用，可以把一個(gè)div 放到 body 標(biāo)簽下，然后為div指定一個(gè)類, 然后CSS這樣設(shè)計(jì)： container{ minwidth: 600px。} 第一個(gè)minwidth是正常的； 但第2行的width使用了 Javascript，這只有IE才認(rèn)得，這也會(huì)讓你的HTML文檔不太正規(guī)。 左邊對(duì)象浮動(dòng)，右邊采用外補(bǔ)丁的左邊距來(lái)定位，右邊對(duì)象內(nèi)的文本會(huì)離左邊有3px的間距. box{ float:left。 border:1px solid E00。 width:50%。} right{ width:50%。} *html left{ marginright:3px。 有些內(nèi)容顯示不出來(lái)，當(dāng)鼠標(biāo)選擇這個(gè)區(qū)域是發(fā)現(xiàn)內(nèi)容確實(shí)在頁(yè)面。頁(yè)面結(jié)構(gòu)盡量簡(jiǎn)單。清除浮動(dòng)。 ① 例如：div id=”floatA” div id=”floatB” div id= NOTfloatC這里的NOTfloatC并不希望繼續(xù)平移，而是希望往下排。) 這段代碼在IE中毫無(wú)問(wèn)題，問(wèn)題出在FF。 在 div class=”floatB” div class=”NOTfloatC”之間加上 div class=”clear”這個(gè)div一定要注意位置，而且必須與兩個(gè)具有float屬性的div同級(jí)，之間不能存在嵌套關(guān)系， 否則會(huì)產(chǎn)生異常。} ②作為外部 wrapper 的 div 不要定死高度,為了讓高度能自動(dòng)適應(yīng)，要在wrapper里面加上overflow:hidden?？梢宰龅?，這樣就達(dá)到了兼容. 例如某一個(gè)wrapper如下定義:.colwrapper{ overflow:hidden。 margin:5px auto。width:100%” div id=”left”/div div id=”center”/div div id=”right”/div /div /div 再嵌入一個(gè)float left而寬度是100%的DIV解決之 ④萬(wàn)能float 閉合(非常重要!) 關(guān)于 clear float 的原理可參見(jiàn) [How To Clear Floats Without Structural Markup],將以下代碼加入Global CSS 中,給需要閉合的div加上class=clearfix 即可,屢試不爽. /* Clear Fix */ .clearfix:after { content:.。 height:0。 visibility:hidden。 } /* Hide from IE Mac */ .clearfix {display:block。 //將對(duì)象作為塊元素級(jí)的表格顯示} 高度不適應(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 p {margintop: 20px。 textalign:center。overflow:hidden。 12 .IE6下為什么圖片下有空隙產(chǎn)生 解決這個(gè)BUG的方法也有很多,可以是改變html的排版,或者設(shè)置img 為display:block 或者設(shè)置verticalalign 屬性為 verticalalign:top | bottom |middle |textbottom 都可以解決. 加上 verticalalign:middle。 height:30px。 verticalalign:middle。 whitespace:nowrap。 otextoverflow:ellipsis。 } /style 解決辦法是將body換成html !DOCTYPE html PUBLIC //W3C//DTD XHTML Strict//EN meta equiv=ContentType content=text/html。 scrollbarhighlightcolor:fff。 scrollbar3dlightcolor:eeeeee。 scrollbartrackcolor:fff。 } /style I E6下這個(gè)問(wèn)題是因?yàn)槟J(rèn)的行高造成的,解決的方法也有很多,例如:overflow:hidden | zoom: | lineheight
教學(xué)教案相關(guān)推薦
鄂ICP備17016276號(hào)-1