目錄
7、text-decoration：文本的修飾（下劃線、上劃線、刪除線等）
1、邊框border
虛線邊框 border:1px dashed #000
實線邊框 border:1px solid #000
2、背景background
單獨寫：
background-color:#fff;
background-image:url('img.png');
background-repeat:no-repeat;
background-position:right top;
合寫：
background:#fff url('img.png') right top no-repeat;
3、圓角border-radius
一個值： border-radius: 25px;
兩個值：border-radius: 15px 50px
三個值：border-radius: 15px 50px 30px
四個值 -：border-radius: 15px 50px 30px 5px
4、position定位
static 靜態定位
absolute 絕對定位
relative 相對定位
fixed 固定定位：相對於瀏覽器窗口定位，並且不會隨着滾動條進行滾動。
5、陰影box-shadow
box-shadow:#ccc 0px 1px 1px;
6、display屬性
none 此元素不會被顯示
block 此元素將顯示爲塊級元素，此元素前後會帶有換行符
inline 默認，此元素會被顯示爲內聯元素，元素前後沒有換行符
inline-block 行內塊元素
inherit 規定應該從父元素繼承display屬性的值
7、text-decoration：文本的修飾（下劃線、上劃線、刪除線等）
text-decoration: none; /*沒有文本裝飾*/
text-decoration: underline red; /*紅色下劃線*/
text-decoration: underline wavy red; /*紅色波浪形下劃線*/
text-decoration:line-through /*刪除線樣式-*/
text-decoration:overline /*上劃線樣式*/
text-decoration:blink /*閃爍*/
8、透明度opacity
filter:alpha(opacity:50); opacity:0.5; -moz-opacity:0.5;-khtml-opacity: 0.5;
9、文本的對齊方式text-align
text-align:center 居中對齊
text-align:left 向左對齊
text-align:right 向右對齊
10、浮動Float
| 值 | 描述 |
|---|---|
| left | 元素向左浮動。 |
| right | 元素向右浮動。 |
| none | 默認值。元素不浮動，並會顯示在其在文本中出現的位置。 |
| inherit | 規定應該從父元素繼承 float 屬性的值。 |
11、clear清除浮動
| 值 | 描述 |
|---|---|
| left | 在左側不允許浮動元素。 |
| right | 在右側不允許浮動元素。 |
| both | 在左右兩側均不允許浮動元素。 |
| none | 默認值。允許浮動元素出現在兩側。 |
| inherit | 規定應該從父元素繼承 clear 屬性的值。 |
12、光標cursor
| 值 | 描述 |
|---|---|
| url |
需使用的自定義光標的 URL。 註釋：請在此列表的末端始終定義一種普通的光標，以防沒有由 URL 定義的可用光標。 |
| default | 默認光標（通常是一個箭頭） |
| auto | 默認。瀏覽器設置的光標。 |
| crosshair | 光標呈現爲十字線。 |
| pointer | 光標呈現爲指示鏈接的指針（一隻手） |
| move | 此光標指示某對象可被移動。 |
| e-resize | 此光標指示矩形框的邊緣可被向右（東）移動。 |
| ne-resize | 此光標指示矩形框的邊緣可被向上及向右移動（北/東）。 |
| nw-resize | 此光標指示矩形框的邊緣可被向上及向左移動（北/西）。 |
| n-resize | 此光標指示矩形框的邊緣可被向上（北）移動。 |
| se-resize | 此光標指示矩形框的邊緣可被向下及向右移動（南/東）。 |
| sw-resize | 此光標指示矩形框的邊緣可被向下及向左移動（南/西）。 |
| s-resize | 此光標指示矩形框的邊緣可被向下移動（北/西）。 |
| w-resize | 此光標指示矩形框的邊緣可被向左移動（西）。 |
| text | 此光標指示文本。 |
| wait | 此光標指示程序正忙（通常是一隻表或沙漏）。 |
| help | 此光標指示可用的幫助（通常是一個問號或一個氣球）。 |
13、!important優先級
button{ width: 150px !important;} /*!important表示強制使用此樣式*/