在過去的大概一個月的學習，基本掌握了HTML+CSS的用法和特性。
這個星期老師給我們布置了一個PC端的實戰項目，並且要求在3-4天內完成，我不惜廢寢忘食，在緊迫的時間內大致地完成了，但是有些效果不能像想象中的那樣實現出來，畢竟時間有限，能力有限。經過了這次的實戰之后，我對此有各方面的總結：
一、技術總結
1. 在開發之前必須要先把這個項目的所有設計圖從頭到尾看一遍，注意觀察相同的部分，比如說每個頁面的頭部和底部都是相同的，那么就把他們提取出來，應用到每個頁面當中，這樣可以大大提高了開發的效率。
2.在開發過程中，肯定寫了很多重復的css樣式，拖慢了開發速度，這樣可以根據個人的習慣和愛好給自己做一套css框架——base.css，作用是重置默認樣式和提供通用樣式。不過在團隊開發中，當然最好就是每個成員都用同一套"base.css"，這樣更容易理解，以提高團隊開發的效率。
以下是我個人初步用的一套base.css：
/* @ 重置默認樣式 */ /* 去除默認內外邊距 */ * { margin: 0; padding: 0; } /* 去除默認邊框 */ img { border: none; } /* 根據要求設定默認字體 */ body { font-family: "微軟雅黑"; } /* @ 提供通用樣式 */ /* 設置左浮動 */ .fl { float: left; } /* 設置右浮動 */ .fr { float: right; } /* 清除浮動 */ .clear { clear: both; } /* 去掉列表前的標識 */ .li-none { list-style: none; } /* 去掉a鏈接下划線 */ .a-none { text-decoration: none; } /* 設置行內塊級元素 */ .in-bl { display: inline-block; }
3.HTML的編碼規范：在遵循HTML標准和語義的前提下，盡量使用最少的標簽並保持最小的復雜度。
比如：如果單獨引入一張圖片可以直接用<img>標簽，而不需要再用一個<div>標簽去包着這個<img>標簽。
4.在bootstrap中有很多關於CSS的編碼規范，在這里我說幾個最實用的，
①有多項選擇器時，將選擇器單獨放在一行。
②為了代碼的易讀性，在每個聲明塊的左花括號前加一個空格，每一個聲明塊的右花括號單獨成行，每條聲明獨占一行。
③以逗號分隔的屬性值，每個逗號后面都應該插入一個空格。
④省略小於1的小數前面的0 （如：用.5代替0.5）。
⑤當值為0時，省略單位 （如：margin: 0;）
5.代碼注釋：在我的理念中，注釋分為兩種，一種是用於划分內容區塊，一種是對某些代碼進行描述。編寫代碼注釋，更方便於后期維護，並且易於他人理解。
舉個簡單的例子：
/* content 開始 */ #content { width:500px; /*content的寬高均為500px*/ height: 500px; } /* content 結束 */
6.至於clss和id的命名，最好還是用英文單詞吧，不要用拼音和純數字。如果英文單詞過長，可以用縮寫，不過要在別人都能理解的情況下使用縮寫。如果一個類有多項的時候，可以用英文單詞+數字，比如（.box01 .box02 .box03 ……）。
二、心態總結
在長時間編寫代碼的時候，難免會感到煩躁，甚至抓狂。如果不調整好心態，就很難繼續下去。還有些時候，會被周圍的環境影響到自己。我呢，平時在編寫代碼時，會帶上耳機，聽着音樂，與世隔絕。