第6天：DIV+CSS頁面布局實戰
阿新 • • 發佈：2017-08-20
pan n) bsp css 運行 是個 例子 使用 記得
今天我從早上9:00寫代碼一直寫到下午18:00，寫的我差點抑郁了，還好最後終於寫出了一個完整頁面，沒有做動畫效果，就是練習了一下DIV+CSS布局，做的是福務達(www.zzfwd.cn)的主頁，真是不容易。然後放松了一下，收拾了一下東西，看了一會電視劇，心情才好點了。在這個例子中我總結了幾點經驗：
1、ul中只能放li，li是個容器，li中可以放任何標簽內容。
2、在寫CSS之前，記得要對標簽等清除默認樣式，這樣在後面布局中就不會有誤差。
3、任何一種效果都可以用多種方法實現，不一定要和別人一樣，要有自己的想法，寫出屬於自己的風格，代碼要精簡優化。
在寫代碼過程中，有個問題，一直困擾著我，“如何讓內容在container中居中 ”，雖然我用自己的方法解決了，但還是不滿意，一定有更好的方法，這個問題，我之後百度了一下，有這麽幾種方法，一定得記住。
以下是常用的兩種水平居中方法：
一、行內元素居中
行內元素居中是只針對行內元素的，比如文本（text）、圖片（img）、按鈕等行內元素，可通過給父元素設置 text-align:center 來實現。另外，如果塊狀元素屬性display 被設置為inline時，也是可以使用這種方法。但有個首要條件是子元素必須沒有被float影響，否則一切都是無用功。
text-align:center
二、塊元素居中
1、定寬塊狀元素居中
滿足定寬（塊狀元素的寬度width為固定值）和塊狀兩個條件的元素可以通過設置“左右margin”值為“auto”來實現居中。
margin:0 auto;（必須設置寬度）
2、不定寬元素居中方法後續再學習總結
今天做的練習代碼有點多，就不附了。圖片為證。運行效果如下：
第6天：DIV+CSS頁面布局實戰