tab：&emsp 空格： 
文本格式化：
1.上標和小標，<sup>和<sub>，如m³ m<sup>3</sup>
大屏展現，網頁自動縮放
transform:scale(0.46875, 0.703125);
transform-origin :left top 0px
佈局：
建立高級的佈局很是耗時間，去網上尋找網站模板，並優化它是最好的辦法。
利用float佈局，利用有意義的元素進行清理。
子元素要使用絕對定位時，父元素要使用相對定位。才能相對於父元素進行絕對定位。
css:
1.背景圖片可設置不隨滾動條滾動，background-attachment:fixed
4.外邊距合併
指的是，當兩個垂直外邊距相遇時，它們將造成一個外邊距。
合併後的外邊距的高度等於兩個發生合併的外邊距的高度中的較大者。
5.特殊的css選擇器，僞類僞元素，到w3cschool去查。
6.除非已經聲明瞭 !DOCTYPE，不然使用 margin:auto 在 IE8 以及更早的版本中是無效的。
居中：margin:auto,text-align:center
註釋：只有普通文檔流中塊框的垂直外邊距纔會發生外邊距合併。行內框、浮動框或絕對定位之間的外邊距不會合並。
7.用backgroud來設置全部背景屬性（不用backgroudcolor，image）
8.若是圖片是頁面的內容則用img，不然用background·
一次申明：
背景圖 background: #ff0000 url(/i/eg_bg_03.gif) no-repeat fixed center;
列表樣式 list-style: square inside url('/i/eg_arrow.gif')
字體 font:italic bold 12px/30px arial,sans-serif;
邊框 border:1px solid #98bf21;
輪廓 outline:#00ff00 dotted thick;
css3邊框圖片
border-image:url(border.png) 30 30 round;
-moz-border-image:url(border.png) 30 30 round; /* 老的 Firefox */
-webkit-border-image:url(border.png) 30 30 round; /* Safari 和 Chrome */
-o-border-image:url(border.png) 30 30 round; /* Opera */
瀏覽器兼容性
一旦爲頁面設置了恰當的 DTD，大多數瀏覽器都會按照上面的圖示來呈現內容。然而 IE 5 和 6 的呈現倒是不正確的。根據 W3C 的規範，元素內容佔據的空間是由 width 屬性設置的，而內容周圍的 padding 和 border 值是另外計算的。不幸的是，IE5.X 和 6 在怪異模式中使用本身的非標準模型。這些瀏覽器的 width 屬性不是內容的寬度，而是內容、內邊距和邊框的寬度的總和。
雖然有方法解決這個問題。可是目前最好的解決方案是迴避這個問題。也就是，不要給元素添加具備指定寬度的內邊距，而是嘗試將內邊距或外邊距添加到元素的父元素和子元素。
當像這樣對齊元素時，對 <body> 元素的外邊距和內邊距進行預約義是一個好主意。這樣能夠避免在不一樣的瀏覽器中出現可見的差別。
當使用 position 屬性時，IE8 以及更早的版本存在一個問題。若是容器元素（在咱們的案例中是 <div class="container">）設置了指定的寬度，而且省略了 !DOCTYPE 聲明，那麼 IE8 以及更早的版本會在右側增長 17px 的外邊距。這彷佛是爲滾動條預留的空間。當使用 position 屬性時，請始終設置 !DOCTYPE 聲明：