19.為什麼這個背景顏色無法顯示
<!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"> <!-- ul { background:red } li { float:left; width:180px; } --> </style> <ul> <li>web標準常見問題大全</li> <li>web標準常見問題大全</li> <li>web標準常見問題大全</li> <li>web標準常見問題大全</li> <li>web標準常見問題大全</li> </ul>
[Ctrl+A 全選 注:如需引入外部Js需重新整理才能執行]
IE中設定有背景色的ul並沒有顯示出來，這個屬於haslayout問題，解決的辦法也很多參考：http://bbs.blueidea.com/viewthread.php?tid=2636904
20.怎麼樣才能讓層顯示在FLASH之上呢
<!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 { position:absolute; top:20px; left:20px; width:200px; height:200px; background:red } object { width:500px; height:100px; } --> </style> web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全web標準常見問題大全 <object type="application/x-shockwave-flash" data="http://gg.blueidea.com/2005/www/m533-104.swf"> <param name="movie" value="http://gg.blueidea.com/2005/www/m533-104.swf" /> </object>
[Ctrl+A 全選 注:如需引入外部Js需重新整理才能執行]
解決的辦法是給FLASH設定透明
21.怎樣使一個層垂直置中於瀏覽器中
<!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 { position:absolute; top:50%; left:50%; margin:-100px 0 0 -100px; width:200px; height:200px; border:1px solid red; } --> </style> web標準常見問題大全
[Ctrl+A 全選 注:如需引入外部Js需重新整理才能執行]
這裡我們使用百分比絕對位置，與外補丁負值的方法，負值的大小為其自身寬度高度除以二
22 .圖片垂直與容器內
複製代碼 代碼如下:
參考：http://bbs.blueidea.com/thread-2666987-1-1.html
23.如何讓三列橫向排列
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <style> div { float:left; margin:1px; width:200px; height:200px; background:orange } </style>
[Ctrl+A 全選 注:如需引入外部Js需重新整理才能執行]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <style> div { position:absolute; top:50%; left:50%; margin:-100px 0 0 -300px; } </style> 1 2 3
[Ctrl+A 全選 注:如需引入外部Js需重新整理才能執行]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <style> span { margin:1px; display:-moz-inline-box; display:inline-block; width:300px; height:200px; background:orange; } </style><span></span> <span></span> <span></span>
[Ctrl+A 全選 注:如需引入外部Js需重新整理才能執行]
橫向排列DIV可以使用浮動的方式比如float:left,或者用內聯方式，還可以絕對位置對象等等.
