由一個CSS的區別談開去

最後更新：2018-12-07 來源：互聯網

上載者：User

創建阿里雲帳戶，並獲得超過 40 款產品的免費試用版；而企業帳戶則可以享有總值 $1200 的免費試用版。立即註冊！

今天有時間，看CSS基礎教程。（看到有很多人自以為懂很多，直接就上馬看Maseter Css，我拿起來翻了翻怎麼還是有很多看不懂呢？，底子太薄,所以我還是看基礎好了。）
看到一個例子：

1<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
2<head>
3<title>text test</title>
4<link type="text/css" href="css2.css" media="screen" rel="stylesheet"/>
5</head>
6<body>
7<div id="container">
8This is a Test.I did many tests recently! And it's very good!!!
9</div>
10
11</body>
12</html>
13

css：

1/**//* body  */
2body
3{}{
4    background-color:White;/**//*並非所有都為白色背景*/
5    margin:10px;
6    border:1px solid #000;
7    padding:10px;
8    font-family:Arial;
9    font-size:16px;
10    /**//* font-weight:600;
11
12    font-style:italic;  */
13
14    line-height:2; /**//*為font-size 的兩倍*/
15}
16
17#container
18{}{
19    width:400px;
20    /**//*
21    margin-top:20px;
22    margin-left:200px;
23    margin-bottom:5em;
24    /* margin-right:400px; */
25    border:1px solid #000;
26    padding:20px;
27    background:#CCC;
28    margin:10px auto 10px auto;
29
30}

在IE 6.0中顯示如下：

在FireFox 2.0中顯示如下：

注意邊框哪裡來的？（其實我也不太清楚）
還有IE不置中，而FF是置中的（據說FF更符合標準一些）。
慢慢的慢慢的會發現IE和其他瀏覽器有很多區別。同樣，在JavaScript裡也有很多需要注意不同瀏覽器的情況（等有時間收集一下吧）。為什麼都不按照標準來呢？這樣需要耗費多少的精力啊。
不僅要考慮程式實現的問題，開發和設計人員還需要考慮不同的瀏覽器的不同效果，因為使用者首先看到的就是現實效果（這裡只談B/S的）。需要考慮不同瀏覽器中的(X)HTML，CSS，Javascript 。
不過好像在中國這個情況還不是特別突出，因為大家設計一般都是以MS的IE為標準的，國內使用者90%以上（我指的普通使用者，不包括開發人員）都是用的IE，即使不是用的IE也是用的IE核心的，其實都一樣的。
所以網站的標準化問題還沒有特別人關注。
舉個例子：
我們公司由於我們開發的都是基於MS .NET的，所以肯定建議使用者都用IE，而且我們都是開發公司內部使用的系統，並不針對外部使用者，所以很少有人發現瀏覽器安全色的問題。
但若你拿FF或其他瀏覽器一看，簡直不堪入目（說明一下：基本都是用的Table布局的），那簡直就是沒發用。所有的布局都錯位了。

可能有很多人根本就認為IE是標準，所以做的時候直接用IE測試就好了，唉，也難怪，難道為了那10%左右的使用者再去花40%的精力和功夫(這也是其他更多人考慮的)？
我想不過不了多長時間標準化應該會成為一個熱點了。。。

在這裡我要推薦一個人的部落格，看了一定大有收穫：
http://www.cnblogs.com/JustinYoung/

本文章原先以中文撰寫並發佈於 aliyun.com，亦設英文版本，僅作資訊用途。本網站不對文章的準確性，完整性或可靠性或其任何翻譯作出任何明示或暗示的陳述或保證。如對該文章有任何疑慮或投訴，請傳送電郵至 info-contact@alibabacloud.com 並提供相關疑慮或投訴的詳細說明。職員會於 5 個工作天內與您聯絡，一經驗證之後，即會刪除該侵權內容。

A Free Trial That Lets You Build Big!

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

Get Started for Free

Sales Support

1 on 1 presale consultation

Chat Contact Sales
After-Sales Support

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

Open a Ticket
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.

Learn More