專案中必須知道有關css和html的常識

根據模組化的思想，將目錄劃分為html，css，image三大部分。

css部分：（base.css、globa.css和mod資料夾）

1、base.css放置的是reset，clearfix等基礎類和工具類；

2、globa.css放置的是布局樣式，包括header，footer等樣式；

3、mod資料夾下面放置的模組，元件的樣式；

html部分：（mod資料夾和template資料夾）

1、mod資料夾下面放的是模組的**片段集合。如果有可能盡可能粒度劃分的更細，因為這些都是**片段，希望以後有工具做到**片段和css的自動載入;

2、template資料夾下面放的是產出物，其實就是一些模組的拼合。只要模組寫的夠好這塊工作就很好做了。

images部分：（base資料夾、data資料夾、icon資料夾和mod資料夾）

1、資料夾的部署和css部署是對應的，base和global的前景圖和背景圖放在base資料夾裡面。

2、用作例子的示例放在data裡面比如，頭像之類的

3、第三方和icon放在icon的資料夾中

4、mod資料夾中放的是模組所需要的前景圖和背景圖，小圖示用sprite合併到base中

下面是幾個有關css的tips：

1、對非a標籤新增偽類狀態，例如span:hover{}。在採用偷天換日的手法a:hover span{}，解決ie6相容只許新增乙個a:hover觸發ie6下a標籤hover狀態的haslayout即可。

2、選項卡去掉虛線框，ie解決方案：；ff下解決方案：a:focus

3、內聯元素居中水平採用父元素text-align:center;垂直採用height=line-height；塊級元素水平居中自身margin：0 auto;text-align:left（對子內聯元素不入侵）

父元素text-align:center;塊級元素可以採用text-indent調解左邊距，比padding-left的好處在與不會影響固定寬度值

4、小存為gif檔案比png-8要小，但是像css sprites這種顏色種類不多的大存為png-8要比gif要小

5、內聯元素用display:inline-block;比較給力，ie6下雖然不支援這個屬性，但是會觸發內聯元素的haslayout，所以表象一樣。塊級元素就不行了

6、內聯元素float:left;之後按理說應該表現為塊級，但是文字在ie6和ie7下會填充上一行的空隙。解決方案white-space: pre;

7、ie6下當高度小於font-size的時候，會被撐高。解決方案：font-size:1px;

8、css在瀏覽器渲染過程中是從右向左讀取的，盡量不用名字空間約束樣式名，盡量不對元素直接寫樣式。

專案中必須知道有關css和html的常識

根據模組化的思想，將目錄劃分為html，css，image三大部分。css部分 base.css globa.css和mod資料夾 1 base.css放置的是reset，clearfix等基礎類和工具類 2 globa.css放置的是布局樣式，包括header，footer等樣式 3 mod資料夾...

15個你必須知道的CSS常識

1 不要使用過小的做背景平鋪。這就是為何很多人都不用 1px 的原因，這才知曉。寬高 1px 的平鋪出乙個寬高 200px 的區域，需要 200 200 40,000 次，占用資源。2 無邊框。推薦的寫法是 border none 哈哈，我一直在用這個。border 0 只是定義邊框寬度為零，但邊框...

你必須知道的css系列 開篇有益

css這個話題在web2.0即將走到終端，3.0即將到來的今天可以相信絕大多數的開發人員都不陌生。其實這門技術本身並不難掌握，就拿我自己來說，記得07年因為當初工作需要從第一次知道css這個概念到能上手使用，前後好像就用了乙個禮拜的時間，當時還自以為是的覺得css也就是這麼回事，但隨著時間的推移，才...