正如多數人的認知一樣，html和css並不難學難用，從學習曲線上來說確實如此，難度甚至不如使用vim。但是寫不寫得好又是另一回事，好的css**能用最少的**量實現功能，易修改且效能佳。易修改，舉個最簡單的例子，比如要求修改乙個div的高寬且保持其子div自適應高寬，若是寫死了子div的高寬，修改工作很麻煩，所以最好是將子div在需求下盡可能寫成自適應，這樣修改時就只需要修改父div的高寬即可。效能佳，能用css實現的絕對不用js實現，不管是網頁布局還是動畫效果，原生的css都是快速又具備高度相容性的選擇。
清除浮動
清除浮動是個常見問題，不少人的解決辦法是新增乙個空的 div 應用 clear:both。事實上僅需要使用after偽類即可在元素尾部自動清除浮動
css code複製內容到剪貼簿
div同行排列
最容易想到的是將一行div全設定為display:inline-block，但這種做法會使得兩個div之間存在「間隔」，這個「間隔」的大小通常程式設計客棧由font-size決定。清除間隔可以通過使用注釋的方法實現。
css code複製內容到剪貼簿
更好的方式自然還是使用float
css code複製內容到剪貼簿
靈活使用bfc
bfc（block formatting context）直譯為「塊級格式化範圍」。當乙個html元素滿足以下任何一點時，就會產生bfc:
float的值不為none
overflow的值不為visible
display的值為table-cell, table-caption或inline-block
position的值不為relative和static
bfc提供了乙個環境，這個環境中的元素不會影響到其它環境中的布局。比如浮動元素形成bfc，浮動元素內部子元素的主要受該浮動元素影響，兩個浮動元素之間是互不影響的。bfc就是乙個作用範圍，可看作是乙個獨立的容器，並且這個容器的布局，與這個容器外的元素毫不相干。
bfc的元素不能與浮動元素重疊，當容器有足夠的剩餘空間容納 bfc 的寬度時，所有瀏覽器都會將 bfc 放置在浮動元素所在行的剩餘空間內。
未垂直對齊
同一行的一組class為item的div使用了display:inline-block或者是float:left時，如果某個div的內部標籤中填充一些文字等內容，可能就會出現垂直不對齊的情況。但非常奇怪的是，這時內部元素並沒有超出父級div的範圍，沒有任何溢位或撐開的情況，這點我也不是很理解，知道其發生原因的同學歡迎留言。解決方法倒不難：
css code複製內容到剪貼簿
display:table-cell的應用
table-cell會被其他一些css屬性破壞，例如float和 position:absolute，所以display:table-cell與flo程式設計客棧at:left或是position:absolute屬性最好不要同用。設定了該屬性的元素對寬度高度敏感，響應padding屬性，對margin值無反應
垂直居中
css code複製內容到剪貼簿
兩欄自適應布局
適用於一欄寬度不固定，比如大小不確定的，另一欄自動調整佔滿剩餘寬度的場景。
css code複製內容到剪貼簿
VIM vim實用技巧小結
使用vim時大多數的時間應該都處於這個模式，所以稱為自然模式 the better you know vim,the less time you will spend in insert mode.游標移動 執行 重複 回退粒度盡量小 命令前使用次數指定命令執行多少次 操作符 動作命令 操作 h o...
python實用技巧（一）
python實用技巧 一 python實用技巧 二 python實用技巧 三 python實用技巧 四 已知x是多維陣列型別，則 在作業系統 windows或者linux 命令列介面下 python v python 3.4 3 anaconda 2.3.0 32 bit 如果我們已經進行pytho...
OFFICE操作實用技巧 一
word excel ppt 這些東西 相信每個做開發的都沒辦法遺棄 有時候有些小技巧不知道做起來還真不方便 於是就有了這個想法 把日常的操作技巧整理出來以方便你我.題記 問題起源 在網上發現一篇好文章，想 down 下來。你還真別看，這麼簡單的事，誰搞不定？可就是有太多的麻煩。你也知道，現在網路上...