恩 最近上了html+css的課 總覺得老師講得有些地方不甚正確所以又碰了一下css

剛好又看到XDite的懶人包 就記錄一下一些常用的css用法跟觀念

css權限
#sidebar h2— 0, 1, 0, 1
h2.title — 0, 0, 1, 1
h2 + p — 0, 0, 0, 2
#sidebar p:first-line — 0, 1, 0, 2
不同屬性的話 會合併起來 相同屬性的話 就會被蓋掉
———————————————————
float
浮動的元素從 parent 的左/右邊界開始排，不夠放的話會找另下一個可以停泊的邊界繼
續排如果浮動的元素高度不同，例如左邊的特別長，旁邊的元素的比他短，則下一個停泊
的不會是左邊界，而是會停在左邊元素的右邊。（下一個可以停泊的邊界原則）

所以float很重要得就是
1.他不占空間 所以只要一float 後面的就會跑上來他原本的空間
2.float排版要看寬度! 要是兩個元素(div之類)都float:right 第一個要是太寬
第二個塞不下在他旁邊就一樣還是會被換到下面去塞，我以前卡在這邊搞很久想說怎都浮不過來0rz

而要清除float 不要讓下面的浮上來要下
<div style=”clear:both”> </div>

XDite 有一個 self-cleared 技巧也可以用 只是我暫時用不出來
而他只是比較不礙眼的做法而已
—————————————
水平置中技巧
margin: 0 auto;
——————————–
圖片取代文字技巧
使用 text-indent: -9999px;

.logo {
background: url(logo.png);
display: block;
height: 100px;
width: 200px;
text-indent: -9999px;
}

XDite 還有講一些 我也不知道是甚麼的東西 這邊紀錄一下
http://blog.xdite.net/posts/2012/01/29/css-tricks-summary/

—
davidou：置中要給他寬才會置中 不然他應該會吃滿全版就感覺不出來