好幾天沒更新博客了，剛實戰完一個HTML+CSS的簡單項目。經過幾天的摸索，發現收益良多。之前只是單純得寫demo，看知識點，沒有親自實戰項目。但實戰過后才會了解，如何才能更好地提升自己的技術。針對這次項目開發，我總結了以下內容：
一、技術總結
1、公共樣式的設定
在開始項目之前，我們可以先大體了解一下項目中每個頁面的內容，比如字體樣式，段落結構，文字大小等。我們可以針對這些內容來設定一個固定的樣式文件。在開發中 就可以直接引入此文件，而無需再重復敲CSS代碼。
CSS Code復制內容到剪貼板
- /*基本樣式*/
- * {
- margin:0;
- padding:0;
- }
- body {
- font-family: "微軟雅黑";
- }
- .clear { /*清除兩邊浮動*/
- clear: both;
- }
- .fl { /*清除左浮動*/
- float: left;
- }
- .fr { /*清除右浮動*/
- float: rightright;
- }
- a { /*去掉鏈接的默認下劃線*/
- text-decoration: none;
- }
- li { /*去掉列表默認樣式*/
- list-style: none;
- }
需要用到時就直接在類名后加上所要用到的類名即可：
XML/HTML Code復制內容到剪貼板
- <div class="div01 lf"></div>
- <div class="div02 clear"></div>
2、整體布局
開發項目過程時，若事前先將每一頁的框架搭建好，而后期就只需把具體內容填充進去就可以了。而我就習慣用以下框架來實現頁面整體布局：
XML/HTML Code復制內容到剪貼板
- <body>
- <div id="header"></div><!--頁面頂部內容-->
- <div id="nav"></div><!--導航部分-->
- <div id="content"></div><!--頁面中間內容-->
- <div id="footer"></div><!--頁面底部-->
- </body>
【網站聲明】本站除付費源碼經過測試外，其他素材未做測試，不保證完整性，網站上部分源碼僅限學習交流，請勿用于商業用途。如損害你的權益請聯系客服QQ：2655101040 給予處理，謝謝支持。