在 CSS 中，可以使用多種屬性來水平對齊元素。
塊級元素指的是佔據全部可用寬度的元素，並且在其前後都會換行。比如<h1><p><div>。塊級元素就是會佔用一整行，與之相對應的是內聯元素。
如果把margin的非簡寫屬性margin-left和margin-right的值設置成爲auto的話，因爲均等地分配可用的外邊框，所以結果就會變成居中顯示了。（這個快元素的顯示可別是百分之百，這樣看不出來什麼效果的）。
如果用position屬性的值absolute，可以進行左右對齊。用left和right屬性便可以了。當然，這裏的寬度也不要設置成百分之百。文本框的默認寬度是整個瀏覽器頁面的寬度，不設置看不出來。（絕對定位元素會被從正常流中刪除，並且能夠交疊元素。）
對齊元素時，對 <body> 元素的外邊距和內邊距進行預定義是一個好主意。這樣可以避免在不同的瀏覽器中出現可見的差異。（我只是在Firefox試過，沒有什麼經驗）
如果用float屬性來對齊也是可以的。
CSS尺寸屬性是控制元素的高度和寬度的，有height，width，line-height，max-height，max-width，min-height，min-width七個屬性。
max-height 屬性設置元素的最大高度。該屬性值會對元素的高度設置一個最高限制。因此，元素可以比指定值矮，但不能比其高。不允許指定負值。可能的值有：none，length和%。默認none表示沒有限制。這裏要說明的是如果一個<p>的文本內容超出了他的最大高度，也是可以顯示出來的，但多出的位置不屬於這個元素框內的。所以如果有別的元素框在，超出的部分文本會被覆蓋掉的。
min-height屬性設置元素的最小高度。與上面的相對應，如果這個文本內容太少，但又不想下面的元素框跟着太緊密了，就可以設置一下最小高度。可能的值是length(默認，0）和%屬性。
max-width屬性與max-height一樣的，min-width與min-height一樣的。別的屬性在之前寫過了。
CSS分類屬性控制如何顯示元素，設置圖像顯示於另一元素中的何處，相對於其正常位置來定位元素，使用絕對值來定位元素，以及元素的可見度。下面幾個屬性都屬於分類屬性：clear，cursor，display，float，position，visibility。
cursor屬性規定當指向某元素之上時顯示的指針類型。默認值是auto，用瀏覽器設置的光標。可能值很多default，crosshair（十字線），pointer（一隻手），move，e-resize，ne-resize，nw-resize，n-resize，se-resize，s-resize，w-resize，text，wait，help。NSWE表示的東西南北方向，兩個就是斜着的方向。
display設置是否及如何顯示元素。可能的值很多啊！！我都沒有用過。默認爲none此元素不會被顯示（跟visibility有什麼區別？這裏none很像visibility:collapse感覺不出存在）。block此元素將顯示爲塊級元素。inline，默認值，表示此元素會被顯示爲內聯元素。inline-block表示行內塊元素，即這一行有換行符的。省下的略，暫時沒用到
visibility 屬性規定元素是否可見。默認值visible可見，可能的值還有，hidden不可見，collapse當在表格元素中使用時，此值可刪除一行或一列，但是它不會影響表格的佈局。被行或列佔據的空間會留給其他內容使用。如果此值被用在其他的元素上，會呈現爲 "hidden"。這裏的隱藏是大隱藏，讓人感覺不出來的隱藏，後面的補空，hidden隱藏只會隱藏該值，但是空格被保留了下來。
CSS導航條
導航欄基本上是一個鏈接列表，因此使用 <ul> 和 <li> 元素是非常合適的，從列表中去掉圓點和外邊距。合適的背景顏色，合適寬度，合適內邊距，合適的字體，然後a僞類設置hover和a:action。這樣差不多快弄好一個好看的列表了。
如果是垂直導航欄的情況下，需要用display:block屬性值，在一定的寬度下，都可以點到這個鏈接。如果是水平導航欄的情況，可以使用行內或着浮動列表項。但是如果希望鏈接擁有相同的尺寸，就必須用浮動方法。第一種：display:inline這種把塊級變成了內聯，這樣幾個元素就可以帶着同一行了。但鏈接的寬度是不同的，原因是內聯元素好像沒有塊級那麼多框屬性。所以用第二種方法就好了，對列表<li>進行浮動，這樣便可以設置寬度了。
CSS圖片庫，圖像透明度
與導航條一樣，想設置漂亮的圖片庫，就應該設置很多屬性。
CSS創建透明圖像是很容易的。使用屬性 opacity 來設定透明度。opacity 屬性能夠設置的值從 0.0 到 1.0。值越小，越透明。更早的版本使用的是濾鏡 filter:alpha(opacity=x)。x 能夠取的值從 0 到 100。值越小，越透明。使用時都寫上，可以在不同的瀏覽器中正確的顯示的。
img
{
opacity:0.4;
filter:alpha(opacity=40); /* 針對 IE8 以及更早的版本 */
}
<pre>img:hover
{
opacity:1.0;
filter:alpha(opacity=100); <span class="code_comment">/* 針對 IE8 以及更早的版本 */</span>
}