 |
|
||||||||||||||
 |
||
邊框屬性設定在CSS中，幾乎所有的元件都可以使用框線設定，不像HTML般，只有表格才可使用框線。我們不但可任意控制框線粗細、顏色，就連框線的形式都可以設定。 BORDER功能 :設定邊框 語法 : { BORDER : ( border-width )︱( border-style )︱( color ) } ( border-width ) - 可設薄、普通、厚、長度-單位屬性
: 點pt、英寸in、公分cm、像素px 範例 : {BORDER:THICK DOUBLE RED} BORDER-BOTTOM功能 : 設定下邊框 語法 : { BORDER-BOTTOM : ( border-bottom-width )︱( border-style )︱( color ) } 範例 : {BORDER-BOTTOM:GROOVE #00FF00} BORDER-BOTTOM-COLOR功能 : 設定下邊框顏色，可設為顏色名稱 ( 16種 ) 或16進制表示法 - #RRGGBB ( 00暗~FF亮 ) 、#RGB ( 0暗~F亮 ) 表紅綠藍強度 語法 : { BORDER-BOTTOM-COLOR : ( color ) } 範例 : {BORDER-BOTTOM-COLOR:BLUE} BORDER-BOTTOM-STYLE功能 : 設定下邊框樣式 ( 可設無、實線、雙線、溝線、脊線、嵌入線、浮出線 ) 語法 : { BORDER-BOTTOM-STYLE : NONE︱SOLID︱DOUBLE︱GROOVE︱RIDGE︱INSET︱OUTSET } 範例 : {BORDER-BOTTOM-STYLE:INSET} BORDER-BOTTOM-WIDTH功能 : 設定下邊框寬度 ( 可設薄、普通、厚、長度-單位屬性 : 點pt、英寸in、公分cm、像素px ) 語法 : { BORDER-BOTTOM-WIDTH : THIN︱MEDIUM︱THICK︱( length ) } 範例 : {BORDER-BOTTOM-WIDTH:1cm} BORDER-COLOR功能 : 設定邊框顏色，可設為顏色名稱 ( 16種 ) 或16進制表示法 - #RRGGBB ( 00暗~FF亮 ) 、#RGB ( 0暗~F亮 ) 表紅綠藍強度 語法 : { BORDER-COLOR : ( color ) } 範例 : {BORDER-COLOR:#FFFF00} BORDER-LEFT功能 : 設定左邊框 語法 : { BORDER-LEFT : ( border-left-width )︱( border-style )︱( color ) } 範例 : {BORDER-LEFT:THIN OUTSET} BORDER-LEFT-COLOR功能 : 設定左邊框顏色，可設為顏色名稱 ( 16種 ) 或16進制表示法 - #RRGGBB ( 00暗~FF亮 ) 、#RGB ( 0暗~F亮 ) 表紅綠藍強度 語法 : { BORDER-LEFT-COLOR : ( color ) } 範例 : {BORDER-LEFT-COLOR:#00FF00} BORDER-LEFT-STYLE功能 : 設定左邊框樣式 ( 可設無、實線、雙線、溝線、脊線、嵌入線、浮出線 ) 語法 : { BORDER-LEFT-STYLE : NONE︱SOLID︱DOUBLE︱GROOVE︱RIDGE︱INSET︱OUTSET } 範例 : {BORDER-LEFT-STYLE:RIDGE} BORDER-LEFT-WIDTH功能 : 設定左邊框寬度 ( 可設薄、普通、厚、長度-單位屬性 : 點pt、英寸in、公分cm、像素px ) 語法 : { BORDER-LEFT-WIDTH : THIN︱MEDIUM︱THICK︱( length ) } 範例 : {BORDER-LEFT-WIDTH:THICK} BORDER-RIGHT功能 : 設定右邊框 語法 : { BORDER-RIGHT : ( border-right-width )︱( border-style )︱( color ) } 範例 : {BORDER-RIGHT:10pt #00A} BORDER-RIGHT-COLOR功能 : 設定右邊框顏色，可設為顏色名稱 ( 16種 ) 或16進制表示法 - #RRGGBB ( 00暗~FF亮 ) 、#RGB ( 0暗~F亮 ) 表紅綠藍強度 語法 : { BORDER-RIGHT-COLOR : ( color ) } 範例 : {BORDER-RIGHT-COLOR:#00F} BORDER-RIGHT-STYLE功能 : 設定右邊框樣式 ( 可設無、實線、雙線、溝線、脊線、嵌入線、浮出線 ) 語法 : 範例 : BORDER-RIGHT-WIDTH功能 : 設定右邊框寬度 ( 可設薄、普通、厚、長度-單位屬性 : 點pt、英寸in、公分cm、像素px ) 語法 : { BORDER-RIGHT-WIDTH : THIN︱MEDIUM︱THICK︱( length ) } 範例 : {BORDER-RIGHT-WIDTH:10px} BORDER-STYLE功能 : 設定邊框樣式 ( 可設無、實線、雙線、溝線、脊線、嵌入線、浮出線 ) 語法 : { BORDER-STYLE : NONE︱SOLID︱DOUBLE︱GROOVE︱RIDGE︱INSET︱OUTSET } 範例 : {BORDER-STYLE:DOUBLE} BORDER-TOP功能 : 設定上邊框 語法 : { BORDER-TOP : ( border-top-width )︱( border-style )︱( color ) } 範例 : {BORDER-TOP:1in YELLOW} BORDER-TOP-COLOR功能 : 設定上邊框顏色，可設為顏色名稱 ( 16種 ) 或16進制表示法 - #RRGGBB ( 00暗~FF亮 ) 、#RGB ( 0暗~F亮 ) 表紅綠藍強度 語法 : { BORDER-TOP-COLOR : ( color ) } 範例 : {BORDER-TOP-COLOR:RED} BORDER-TOP-STYLE功能 : 設定上邊框樣式 ( 可設無、實線、雙線、溝線、脊線、嵌入線、浮出線 ) 語法 : { BORDER-TOP-STYLE : NONE︱SOLID︱DOUBLE︱GROOVE︱RIDGE︱INSET︱OUTSET } 範例 : {BORDER-TOP-STYLE:SOLID} BORDER-TOP-WIDTH功能 : 設定上邊框寬度 ( 可設薄、普通、厚、長度-單位屬性 : 點pt、英寸in、公分cm、像素px ) 語法 : { BORDER-TOP-WIDTH : THIN︱MEDIUM︱THICK︱( length ) } 範例 : {BORDER-TOP-WIDTH:THIN} BORDER-WIDTH功能 : 設定邊框寬度 ( 可設薄、普通、厚、長度-單位屬性 : 點pt、英寸in、公分cm、像素px ) 語法 : { BORDER-WIDTH : THIN︱MEDIUM︱THICK︱( length ) } 範例 : {BORDER-WIDTH:10pt} 綜合範例<SCRIPT LANGUAGE="JavaScript"> | ||