css書寫規范 & 頁面布局規范 &常用案例經驗總結

CSS 屬性書寫順序(重點)

建議遵循以下順序：

1. 布局定位屬性：display / position / float / clear / visibility / overflow（建議 display 第一個寫，畢竟關系到模式）
2. 自身屬性：width / height / margin / padding / border / background
3. 文本屬性：color / font / text-decoration / text-align / vertical-align / white- space / break-word
4. 其他屬性（CSS3）：content / cursor / border-radius / box-shadow / text-shadow / background:linear-gradient

頁面布局分析

為了提高網頁制作的效率，布局時通常有以下的布局流程：

1. 必須確定頁面的版心（可視區），我們測量可得知。
2. 分析頁面中的行模塊，以及每個行模塊中的列模塊。其實頁面布局，就是一行行羅列而成的。
3. 制作 HTML 結構。我們還是遵循，先有結構，后有樣式的原則。結構永遠最重要。
4. 開始運用盒子模型的原理，通過 DIV+CSS 布局來控制網頁的各個模塊。

常用案例分析

頭部導航欄

實際開發中不會直接用鏈接a，而是用無序列表li包含a的做法