CSS開發總結 2012 3 22

**開發完了, 幾乎一夜間被變成了css熟手.

跨瀏覽器css開發注意事項:

[位置]

1. div的高度問題

設定height固定值時,

css標準: 高度為固定大小 

ie6:  div內容超出值範圍時,自動調整高度

靜態內容可以設定固定高度; 動態內容設定為auto; ie6須對應設定position:relative.

2. div居中方法:

margin-left:auto;

margin-right:auto;

3. float的應用:

盡量用上一層div包起來;

使用 float:right時, 留意總寬度是否會超出; 如果效果不理想, 可以使用absolute作為代替方案;

4. position:

css標準: 預設值為static;

ie6: 需要設定值為relative, 以防止錯位; (relative用處: 相對父層進行定位)

位置設定: 使用absolute, 配合margin-left/margin-top,或left/right的方法進行定位;

5. 中文英文換行的問題

(網上參考方案)

用 word-wrap:break-word;overflow:hidden;

而不是 word-wrap:break-word;word-break:break-all;

[樣式]

6. 導航欄樣式:

當前頁的標題的css設定: 使用後台判斷url的字串進行處理.(要設計好各個子標題的路徑盡量不要有重複或包含的字串)

判斷到當前標題後, 可以去除當前標題的鏈結, 然後設定加亮樣式;

7. 字型大小:

pt: 固定大小;

em: 可被ie調節大小的格式;

一般情況無針對老年使用者時, 可以全用pt作為單位;

8. 美工:

ie6不支援透明png, 需另外用js處理, 或用相同背景色的;

或者, 不理ie6...(目前ie6的中國市場份額仍有20%.[2012-1資料])

css開發流程:

(基於vs.net ide開發)

1) 確定美工方案;

2) 剪下美工素材;

3) 確定整體框架的div

參考方式:

注: 第4)步完成後, 即可交付後台開發.

CSS開發總結 2012 3 22

開發完了,幾乎一夜間被變成了css熟手.跨瀏覽器css開發注意事項 位置 1.div的高度問題 設定height固定值時,css標準 高度為固定大小 ie6 div內容超出值範圍時,自動調整高度 靜態內容可以設定固定高度 動態內容設定為auto ie6須對應設定position relative.2...

個人CSS開發總結

modules 總結前端三劍客裡，無疑css和html的重視程度遠低於js，一方面是因為js是開發中的核心，js水平的高低往往決定了天花板的高度。另一方面css比較簡單，做出符合產品需求的樣式並不難，而且前端領域不缺輪子，搬搬 也是極好的 筆者也屬於其中 但大部分都誤解的是，css雖然好掌握，但也同...

CSS開發筆記總結

開發中經常使用的就是最好不要把乙個 view 高度寫死。我一般做的就是給view固定的padding 值，讓其有一定的高度。這樣做是為了，有些地方使用者輸入的資料可能會很多，如果高度定死，就會出現被遮蓋顯示不全的問題。想要文字自動換行，除了不要固定寫死高度之外，如果遇到，一長串的英文本元。預設沒有空...