元素轉換
display:block; 行內轉塊
Display:inline; 塊轉行內
Display:inline-block; 塊或行內轉行內塊
鏈接偽類
a:link{屬性:值;} 鏈接默認狀態 a{屬性:值;}是一樣的
a:visited{屬性:值;} 鏈接訪問之后的狀態
a:hover{屬性:值;} 鼠標放上去顯示的狀態
a:active{屬性:值;} 鏈接激活的狀態
:focus{屬性:值;} 獲取焦點
購物車案例：
圖片顯示在網頁中是購物車，鼠標點擊時是登錄：
代碼：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>Document</title>
<style type="text/css"> a{ display: inline-block; width: 67px; height: 32px; background: url("110.png"); } a:hover{ background: url("110.png") bottom } </style>
</head>
<body>
<a href="#"></a>
</body>
</html>
- 瀏覽器默認文字大小
瀏覽器默認文字大小：16px;
行高：基線與基線之間的距離
行高 = 文字高度 + 上下邊距
一行文字行高和父元素高度一致的時候，垂直居中顯示。