web標準常見問題集合4_經驗交流
來源:互聯網
上載者:User
13.為什麼FF下面不能水平置中呢
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <style type="text/css"> <!-- body { text-align:center; } div { margin:0 auto; width:500px; height:200px; border:1px solid red } --> </style>
[Ctrl+A 全選 注:如需引入外部Js需重新整理才能執行]
FF下面設定容器的左右外補丁為auto就可以了
14.為什麼FF下文本無法撐開容器的高度
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <style type="text/css"> <!-- div { width:200px; height:200px; border:1px solid red } --> </style> web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見
[Ctrl+A 全選 注:如需引入外部Js需重新整理才能執行]
標準瀏覽器中固定高度值的容器是不會象IE6裡那樣被撐開的,那我又想固定高度,又想能被撐開需要怎樣設定呢?辦法就是去掉height設定min-height:200px; 這裡為了照顧不認識min-height的IE6 可以這樣定義:
{
height:auto!important;
height:200px;
min-height:200px;
}
15.為什麼IE6下容器的寬度和FF解釋不同呢
<?xml version="1.0" encoding="gb2312"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <style type="text/css"> <!-- div { cursor:pointer; width:200px; height:200px; border:10px solid red } --> </style> web標準常見問題大全 <hr/>
[Ctrl+A 全選 注:如需引入外部Js需重新整理才能執行]
問題的差別在於容器的整體寬度有沒有將邊框(border)的寬度算在其內,這裡IE6解釋為200PX ,而FF則解釋為220PX,那究竟是怎麼導致的問題呢?大家把容器頂部的xml去掉就會發現原來問題出在這,頂部的申明觸發了IE的quirks mode,關於quirks mode、standards mode的相關知識,請參考:http://www.microsoft.com/china/msdn/library/webservices/asp.net/ASPNETusStan.mspx?mfr=true
16.為什麼web標準中IE無法設定捲軸顏色了
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <style type="text/css"> <!-- body { scrollbar-face-color:#f6f6f6; scrollbar-highlight-color:#fff; scrollbar-shadow-color:#eeeeee; scrollbar-3dlight-color:#eeeeee; scrollbar-arrow-color:#000; scrollbar-track-color:#fff; scrollbar-darkshadow-color:#fff; } --> </style>
[Ctrl+A 全選 注:如需引入外部Js需重新整理才能執行]
解決辦法是將body換成html
17.為什麼我定義的樣式沒有作用呢
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <style type="text/css"> <!-- #aa ul li { color:red } .aa { color:blue } --> </style> <ul> <li class="aa"> web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全 </li> </ul>
[Ctrl+A 全選 注:如需引入外部Js需重新整理才能執行]
這裡你無法用.aa定義到li 遇到這種情況怎麼解決呢?答案是提高.aa 的優先權 比如#aa ul li.aa 優先權相關文章參考-baidu搜尋關鍵詞: CSS的優先權
18.為什麼無法定義1px左右高度的容器
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <style type="text/css"> <!-- div { background:red; } --> </style>
[Ctrl+A 全選 注:如需引入外部Js需重新整理才能執行]
IE6下這個問題是因為預設的行高造成的,解決的方法也有很多,例如:overflow:hidden | zoom:0.08 | line-height:1px