DOCTYPE聲明對CSS顯示效果也有影響!

來源:互聯網
上載者:User

看下面兩段代碼

<html>
<head>
<style type="text/css">
span, div {
    width: 100px;
    border: 3px outset buttonface;
}
</style>
</head>
<body>
<span><div>Hello</div></span>
<span><div>World</div></span>
</body>
</html>

 

<!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>
<style type="text/css">
span, div {
    width: 100px;
    border: 3px outset buttonface;
}
</style>
</head>
<body>
<span><div>Hello</div></span>
<span><div>World</div></span>
</body>
</html>

兩段代碼不同之處僅僅是DOCTYPE的聲明,但是請看看它們在IE6中的顯示效果,第1段代碼文字都在同一行,而第2段代碼卻產生了換行!而在FF中顯示效果又是另一番景象……

原來我曾以為,有了CSS之後,可以拋棄表格了。但是現在發現,CSS也靠不住了。
比如我可能會寫一個頁面組件,使用CSS來控制布局,但是我如何知道次組件會用於何種DOCTYPE的頁面的?
而且這個DOCTYPE一般人好像也不怎麼關心,我原來就是這樣,因為不清楚到底有些什麼差別。

看來有些地方還是用表格比較合適,而且處理起來確實比div等要方便的多。在html及css沒有最終統一標準的情況下,table還是能繼續散發其青春活力的!

相關文章

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.