現在**追求越來越漂亮好看,越來越炫,所以css是必不可少的.可是我發現許多人使用css的方式是不對的,至少是不推薦的.
比如下面的css用法不對
(1)乙個頁面對應乙個css檔案
這種做法是我深惡痛絕的,為什麼呢?可重用性太差了!
比如哪天我突然要改變乙個按鈕的樣式,那就壞了,只要包含按鈕的頁面的樣式我都得改,比如有20個頁面包含了按鈕,那麼我就得修改20個css檔案,這不要人命嗎?
根本原因:相同的樣式重複出現在多個檔案中.
(2)編寫css樣式時直接修改html標籤的樣式
例如:
沒有通過id或class,這種方式非常不好,因為它的影響是完全開放的,任何乙個頁面引入該css檔案就會受到影響.我專案中就遇到了.當時我們使用了webcalendar.js 作為日期控制項,本來介面應該是:
但是實際的效果是:
原因:引入的css竟然影響了其他控制項.這不是我們期望的效果.
正確的方式應該是:
想要應用該css怎麼辦?加上class就行了.
(3)相同的**出現在多個地方
這段css**竟然出現了至少四次.如果客戶說要修改行(line-height)的高度,那麼我就要同時修改至少四個地方.這不是自己人坑自己人嗎?
(4)濫用id
例如:我們要知道id的權重是最高的.在日常開發中，我們更多的情況是會遇到如下情況：
#header a假設這是我們的乙個專案，現在我們決定要把乙個在 header 的 另乙個link設定成無邊框，隨手一寫，我們新增了：
.special-link然後再在 html 中新增了乙個 special-link 的class 類，這下解決我們的問題了嗎？ 答案是：沒有！ 由於 id 的權重如此之高，我們需要更高權重的宣告才能實現我們的需求。
下面這樣寫才是正確的：
#header .special-link附件是我總結的html筆記:html02.zip
糟糕的css用法 1
現在 追求越來越漂亮好看,越來越炫,所以css是必不可少的.可是我發現許多人使用css的方式是不對的,至少是不推薦的.比如下面的css用法不對 1 乙個頁面對應乙個css檔案 這種做法是我深惡痛絕的,為什麼呢?可重用性太差了 比如哪天我突然要改變乙個按鈕的樣式,那就壞了,只要包含按鈕的頁面的樣式我都...
糟糕的css用法 1
現在 追求越來越漂亮好看,越來越炫,所以css是必不可少的.可是我發現許多人使用css的方式是不對的,至少是不推薦的.比如下面的css用法不對 1 乙個頁面對應乙個css檔案 這種做法是我深惡痛絕的,為什麼呢?可重用性太差了 比如哪天我突然要改變乙個按鈕的樣式,那就壞了,只要包含按鈕的頁面的樣式我都...
糟糕的設計
不要去弄髒構造器方法！2009 02 24 這是來自自己最近的專案salesys的乙個經驗之一。坦白說，在這個專案，還有以前的幾個專案中糟糕的設計有很多，這個只是其中之一。在salesys的乙個很大的特點就是大部分的模組在開始頁面都有乙個資訊列表，用於顯示這個模組的主要資訊。就像這樣 在我們的 設計...