DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> CSS入門知識 >> CSS詳解 >> IE7和IE8的CSS樣式八大差異(3)
IE7和IE8的CSS樣式八大差異(3)
編輯:CSS詳解     

5、bottom、top

當使用絕對位置時,IE7與IE8會產生些許的偏移,這些偏移是整體性的,所以影響很小
例子:

  1. "http://www.w3.org/TR/xhtml1/DTD/xHtml1-transitional.dtd">
  2. <HtmlXMLnsHtmlXMLns="http://www.w3.org/1999/xHtml">
  3. <head>
  4. <title>title>
  5. head>
  6. <body>
  7. <divstyledivstyle="height:100px;width:200px;border:solid1pxblack">
  8. <divstyledivstyle="background-color:Red;bottom:5px;top:5px;position:absolute;height:40px">
  9. TEST
  10. div>
  11. div>
  12. body>
  13. Html>

很難看出來吧,因為偏移很小,不過確實是偏移了。

6、li+float

UL、LI加上float,在IE7於IE8有相當大的差異,見:

  1. "http://www.w3.org/TR/xhtml1/DTD/xHtml1-transitional.dtd">
  2. <HtmlXMLnsHtmlXMLns="http://www.w3.org/1999/xHtml">
  3. <head>
  4. <title>title>
  5. head>
  6. <body>
  7. <div>
  8. <div>
  9. <ul>
  10. <listylelistyle="cursor:hand;float:left;">
  11. TEST1li>
  12. <listylelistyle="cursor:hand;float:left;">
  13. TEST2li>
  14. <listylelistyle="cursor:hand;float:left;">
  15. TEST3li>
  16. <listylelistyle="cursor:hand;float:left;">
  17. TEST4li>
  18. <listylelistyle="cursor:hand;float:left;">
  19. TEST5li>
  20. ul>
  21. div>
  22. div>
  23. body>
  24. Html>

在IE7上,LI的項目符號被取消了,而在IE8上則正常顯示,但卻因為是float,所以後面的項目符號蓋到前一項目了。修改為程式8的模樣後
,兩者就趨近相同了。

  1. "http://www.w3.org/TR/xhtml1/DTD/xHtml1-transitional.dtd">
  2. <HtmlXMLnsHtmlXMLns="http://www.w3.org/1999/xHtml">
  3. <head>
  4. <title>title>
  5. head>
  6. <body>
  7. <div>
  8. <div>
  9. <ulstyleulstyle="list-style-type:none">
  10. <listylelistyle="cursor:hand;float:left;">
  11. TEST1li>
  12. <listylelistyle="cursor:hand;float:left;">
  13. TEST2li>
  14. <listylelistyle="cursor:hand;float:left;">
  15. TEST3li>
  16. <listylelistyle="cursor:hand;float:left;">
  17. TEST4li>
  18. <listylelistyle="cursor:hand;float:left;">
  19. TEST5li>
  20. ul>
  21. div>
  22. div>
  23. body>
  24. Html>

在嘗試尋找CSS相異點時,許多網站都有這類問題,因為我們常用這

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved