border

屬性樣式	設定值
border 邊框樣式	border-color 之值 border-style 之值 border-width 之值
預設值：依個別特性而定 適用於：all 繼承性：無

這個樣式是用來同時設定四個邊的邊框。

例如，在下面的範例中，同時設定了四個邊的邊框厚度、邊框種類、邊框顏色。

.MyStyle {
	border: 1px solid #ff0000;
	}

border-color

屬性樣式	設定值
border-color 邊框顏色	RGB 設定方式 (#000000 ~ #ffffff) 顏色名稱 (red,blue,black…)
預設值：未定義 適用於：all 繼承性：無

這個樣式是用來設定邊框的顏色。

例如，在下面的範例中，將四個邊框的顏色設定為藍色。

.MyStyle {
	border-width: 1px;
	border-color: #0000ff;
	}

border-color 也可同時分別各自設定每個邊框的顏色(上 右 下 左、上 右左 下、上下 左右、上右下左)。

.MyStyle {
	border-width: 1px;
	border-color: black white red blue;/* 上 右 下 左 */
	}

border-style

屬性樣式	設定值
border-style 邊框種類	none, hidden, dotted, dashed, solid, double, groove, ridge, inset, outset
預設值：未定義 適用於：all 繼承性：無

這個樣式是用來設定邊框的種類。

例如：請參考 border-color(可同時設定四個邊：上 右 下 左、上 右左 下、上下 左右、上右下左)。

border-width

屬性樣式	設定值
border-width 邊框厚度	絕對單位：in、cm、mm、pt、pc 相對單位：em、ex、px thin medium thick
預設值：未定義 適用於：all 繼承性：無

這個樣式是用來設定邊框的厚度。

例如：請參考 border-color(可同時設定四個邊：上 右 下 左、上 右左 下、上下 左右、上右下左)。

border-bottom, border-left, border-right, border-top

屬性樣式	設定值
border-bottom 下方邊框 border-left 左側邊框 border-right 右側邊框 border-top 上方邊框	border-color 之值 border-style 之值 border-width 之值
預設值：未定義 適用於：all 繼承性：無

這個樣式是用來同時設定某個邊框的邊框厚度、邊框種類、邊框顏色。

例如，在下面的範例中，將下方邊框的邊框厚度設為 1px 邊框種類為 solid 邊框顏色為 green。

.MyStyle {
	border-bottom: 1px solid green;
	}

border-bottom-color, border-left-color, border-right-color, border-top-color

屬性樣式	設定值
border-bottom-color 下方邊框顏色 border-left-color 左側邊框顏色 border-right-color 右側邊框顏色 border-top-color 上方邊框顏色	RGB 設定方式 (#000000 ~ #ffffff) 顏色名稱 (red,blue,black…)
預設值：元素的 color 值 適用於：all 繼承性：無

這個樣式是用來設定某個邊框的邊框顏色。

例如，在下面的範例中，將下方邊框的邊框顏色設為 green。

.MyStyle {
	border-bottom-width: 1px;
	border-bottom-color: green;
	}

border-bottom-style, border-left-style, border-right-style, border-top-style

屬性樣式	設定值
border-bottom-style 下方邊框種類 border-left-style 左側邊框種類 border-right-style 右側邊框種類 border-top-style 上方邊框種類	none, hidden, dotted, dashed, solid, double, groove, ridge, inset, outset
預設值：none 適用於：all 繼承性：無

這個樣式是用來設定某個邊框的邊框種類。

例如，在下面的範例中，將下方邊框的邊框種類設為 dashed。

.MyStyle {
	border-bottom-width: 1px;
	border-bottom-style: dashed;
	}

border-bottom-width, border-left-width, border-right-width, border-top-width

屬性樣式	設定值
border-bottom-width 下方邊框厚度 border-left-width 左側邊框厚度 border-right-width 右側邊框厚度 border-top-width 上方邊框厚度	絕對單位：in、cm、mm、pt、pc 相對單位：em、ex、px thin medium thick
預設值：medium 適用於：all 繼承性：無

這個樣式是用來設定某個邊框的邊框厚度。

例如，在下面的範例中，將下方邊框的邊框厚度設為 thin。

.MyStyle {
	border-bottom-width: thin;
	}

文章分類