• color 設置文字的顏色，如： color:red;

• font-size 設置文字的大小，如：font-size:12px;

• font-family 設置文字的字體，如：font-family:‘微軟雅黑‘;

• font-style 設置字體是否傾斜，如：font-style:‘normal‘; 設置不傾斜，font-style:‘italic‘;設置文字傾斜

• font-weight 設置文字是否加粗，如：font-weight:bold; 設置加粗 font-weight:normal 設置不加粗

• line-height 設置文字的行高，設置行高相當於在每行文字的上下同時加間距， 如：line-height:24px;

• font 同時設置文字的幾個屬性，寫的順序有兼容問題，建議按照如下順序寫： font：是否加粗 字號/行高 字體；如： font:normal 12px/36px ‘微軟雅黑‘;

• text-decoration 設置文字的下劃線，如：text-decoration:none; 將文字下劃線去掉

• text-indent 設置文字首行縮進，如：text-indent:24px; 設置文字首行縮進24px

• text-align 設置文字水平對齊方式，如text-align:center 設置文字水平居中

• text-overflow 設置一行文字寬度超過容器寬度時的顯示方式，如：text-overflow:clip 將多出的文字裁剪掉 text-overflow:ellipsis 將多出的文字顯示成省略號

• white-space 一般用來設置文本不換行，如：white-space:nowrap 設置文本不換行 一般與text-overflow和overflow屬性配合使用來讓一行文字超出寬度時顯示省略號

• list-style 一般用來設置去掉ul或者ol列表中的小圓點或數字 如：list-style:none

• width 設置盒子內容的寬度，如： width：100px;

• height 設置盒子內容的高度，如： height：100px;

• border-top 設置盒子頂部邊框的三個屬性 如：border-top:5px solid red;設置盒子頂部邊框為3像素寬的紅色的實線，詳細設置說明：盒子模型

• border-left 設置盒子左邊邊框的三個屬性 如：border-left:3px dotted red;設置盒子左邊邊框為3像素寬的紅色的點線，詳細設置說明：盒子模型

• border-right 設置盒子右邊邊框的三個屬性 如：border-right:2px dashed red;設置盒子右邊框為2像素寬的紅色的虛線，詳細設置說明：盒子模型

• border-bottom 設置盒子底部邊框的三個屬性 如：border-bottom:1px solid red;設置盒子底部邊框為1像素寬的紅色的實線，詳細設置說明：盒子模型

• border 同時設置盒子的四個邊框，如果四個邊的樣式統一就使用它 如：border:1px solid #000 設置盒子四個邊都是1像素寬的黑色實線，詳細設置說明：盒子模型

• padding 設置盒子四個邊的內邊距 如：padding:10px 20px 30px 40px 分別設置盒子上邊(10px)、右邊(20px)、下邊(30px)、左邊(40px)的內邊距(順時針)，詳細設置說明：盒子模型

• margin 設置盒子四個邊的外邊距 如：margin:10px 20px 30px 40px 分別設置盒子上邊(10px)、右邊(20px)、下邊(30px)、左邊(40px)的外邊距(順時針)，詳細設置說明：盒子模型

• overflow 設置當子元素的尺寸超過父元素的尺寸時，盒子及子元素的顯示方式 如：overflow:hidden 超出的子元素被裁切，詳細設置說明：元素溢出

• display 設置盒子的顯示類型及隱藏，如：display:block 將盒子設置為以塊元素顯示 display:none 將元素隱藏，詳細設置說明：元素類型

• float 設置元浮動 如：float:left 設置左浮動 float:right 設置右浮動，詳細設置說明：元素浮動

• clear 在盒子兩側清除浮動 如：clear:both 在盒子兩側都不允許浮動，詳細設置說明：元素浮動

• position 設置元素定位 如：position:relative 設置元素相對定位，詳細設置說明：元素定位

• background 設置元素的背景色和背景圖片，如：background:url(bg.jpg) cyan;設置盒子的背景圖片為bg.jpg，背景色為cyan，詳細設置說明：元素背景

• background-size 設置盒子背景圖的尺寸，如：background-size:30px 40px;設置背景圖的尺寸寬為30px，高為40px，這個屬性不能合到background屬性中，詳細設置說明：retina屏適配

• opacity 設置元素整體透明度，一般為了兼容需要加上filter屬性設置 如：opacity:0.1;filter:alpha(opacity=10)

• cursor 設置鼠標懸停在元素上時指針的形狀 如：cursor:pointer 設置為手型

• outline 設置文本輸入框周圍凸顯的藍色的線，一般是設為沒有 如：outline:none

• border-radius 設置盒子的圓角 如：border-radius:10px 設置盒子的四個角為10px半徑的圓角，詳細設置說明：css圓角

• box-shadow 設置盒子的陰影，如：box-shadow:10px 10px 5px 2px pink;設置盒子有粉色的陰影，詳細設置說明：css陰影

• transition 設置盒子的過渡動畫，如：transition:all 1s ease;設置元素過渡動畫為1秒完成，所有變動的屬性都做動畫，詳細設置說明：過渡動畫

• animation 設置盒子的關鍵幀動畫，詳細設置說明：關鍵幀動畫

• transform 設置盒子的位移、旋轉、縮放、斜切等變形，如：transform:rotate(45deg);設置盒子旋轉45度，詳細設置說明：元素變形

• box-sizing 設置盒子的尺寸計算方式，如：box-sizing:border-box 將盒子的尺寸計算方法設置為按邊框計算，此時width和height的值就是盒子的實際尺寸

• border-collapse 設置表格邊框是否合並，如：border-collapse:collapse，將表格邊框合並，這樣就可以制作1px邊框的表格。

常用css列表