這本書大致的翻了一遍，個人覺得書中所涉及的知識面較廣，就書中所涉及的知識，我來闡述一下我覺得有意思的地方。
一、小知識
1、link 里的 media 是用來指定輸出設備，all表示在所有顯示，handheld表示在移動端顯示，screen表示在普通pc端，print表示打印機輸出
2、一般，選擇器相同的情況下，越在后面的樣式越優先，以下情況除外：
id 選擇器 100分
class 選擇器 10分
.a,.b,.c{} 群組選擇器 1分
* 全局選擇器 0分
后代選擇器
3、塊級元素：address blockquote d div dl fieldset form h1-h6 menu noscript ol p pre table ul
內聯元素：a abbr acronym b bdo big br button cite code dfn em i frame img input kbd label map object q ruby samp select small apn strong sub sup textarea tt var
4、單位用em的時候，相對的是母元素的尺寸，起始狀態以body為基準
5、限制文本的最大最小寬度和高度：min-width,max-width,min-height,max-height。。。。。。text-align:justify強制左右對齊
可見行高：1.5em 150%
二、易于理解的版面要遵守以下幾點：
第一視點的意識 —— 根據屏幕分辨率
滾動條的技巧 —— 盡量別有滾動條，或者可視區域與下半部分有銜接，讓用戶知道并看到下半部分的內容
使用其他環境進行驗證 —— 別的瀏覽器
信息的整理 —— 信息歸類
實現移動的射擊 —— 人眼睛的習慣走勢
配置的平衡 —— 保證頁面不會失去平衡，不要一邊倒，顏色的深淺也決定了頁面的重量，粗大文本也比細小文本重
留白的設計 —— 有空隙感，通氣，可保持平衡管，段落行間距也要統一
三、版面構成：
頁面分割-豎欄 —— PS、AI里的網格，一般把網頁分成9或12個豎欄，黃金比例1:1.618≈5:8
網站統一
頁眉與頁腳統一
鏈接顏色的統一，CSS事先定好樣式，還有一些性質用途相同的按鈕形狀也要統一
留白的統一，要考慮板塊間的留白要統一，可設置通用的樣式加進所有html里
便于理解的導航
全局導航，第一視點，醒目
局部導航，可用作下拉菜單
補充導航
四、有代表性的排版模式：
2豎欄排版
3豎欄排版 —— 1:3:1
倒L字形排版 —— 常用語深層次或多頁面的網站
水平型排版
垂直I字形排版，纖細感
網格型排版
圖像為主型：直接，有沖擊力，圖像旁邊其他的元素要設計的簡單，可以突出圖像
重視留白的排版，給人平靜的感覺
五、速記屬性的使用
margin:0;??? 四邊都是0
margin:10px 20px;??? 上下是10，左右是20
margin:10px 20px 0;??? 上是10，左右是20，下是0
margin:10px 20px 0 30px;??? 上是10，右是20，下是0，左是30
六、需要掌握的CSS特別處理
使用css的特殊處理，但是這不是標準規范，最好不用
IE6 的代表CSS特別處理是“星號處理”和“下劃線處理”，(IE6 MUST DIE，以后不需要考慮了)
星號處理是在選擇器之前添加 *html，下劃線處理是 _height:1%;
例如：? ??
div#wrapper{? ?
width:900px;? ? ? ?
margin:0 auto;?? 在IE5、IE6中這個不能實現居中? ?
}? ?
*html body{??
texr-align:center;?? 所以要在body里設置來達到目的的錯誤? ?
}??
*html div#wrapper{??
text-align:left;?? body了設置了居中，所有子元素就都居中了，所以要用#wrapper還原左對齊? ?
}
只適用于IE7的CSS特別處理是在選擇器之前加? “? *：first-child+html? ”
div#col{? ? ? ?
margin:5px 0 0;? ? ? ?
}? ? ??
ie7和ie6怎么寫呢？? ? ? ?
*:first-child+html div#col,*html div#col{? ? ??
margin:10px 0 0 ;? ? ? ?
}上面的這兩個選擇器寫到一起是不對滴，要分開寫，
如下：
*：first-child+html div#col{? ? ? ?
margin:10px 0 0;? ? ? ?
}? ? ? ?
*html div#col{? ? ? ?
margin:10px 0 0;? ? ? ?
}
七、內部元素超出整體的解決辦法
方法一：after是可以經過指定的元素內容之后追加內容的偽元素，
用content屬性來指定內容，(before)
.col01:after{
content:".";?? 點是在div為col01之后生成的內容，可以使別的什么都行
display:block;?? 讓這個點變成塊
height:0;?? 高度為0，必須設置
visibility:hidden;?? 可見設為隱藏
clear:left;?? 清除左浮動
}
方法二：在div里最后的地方加個空的span標簽，css里display：block；clear：left但是一般html里不放空標簽，所以不推薦
方法三：div class=clearfix，css里.clearfix{overflow:auto;_height:1%}
