框線屬性一覽表 |
border-top : 1px solid #6699cc; /*上框線 粗細1px 實線 水藍色*/
border-bottom : 1px solid #6699cc; /*下框線*/
border-left : 1px solid #6699cc; /*左框線*/
border-right : 1px solid #6699cc; /*右框線*/
線條樣式說明：
- solid /*實線框*/
- dotted /*虛線框*/
- double /*雙線框*/
- groove /*立體內凸框*/
- ridge /*立體浮凸框*/
- inset /*凹框*/
- outset /*凸框*/
框線樣式簡化寫法:
border: 1px solid #6699cc; /*宣告四邊同樣屬性*/
|
使用說明 |
- 新增CSS樣式，例：訪客無法瀏覽此圖片或連結，請先 註冊 或 登入會員 。
- 在欲使用Table框線設定效果的HTML檔中，切換到程式碼畫面，輸入以下紅色列HTML程式碼。
<html>
<head>
<meta http-equiv="Content-Type" c>
<title>CSS框線設定</title>
<link href="table.css" rel="stylesheet" type="text/css">
</head>
<body>
</body>
</html>
|
table.css 參考內容table {
border-top-width: thin; /*上框線寬度 細線*/
border-right-width: medium; /*右框線寬度 中等*/
border-bottom-width: thick;/*下框線寬度 粗線*/
border-left-width: 1px;/*左框線寬度 1px*/
border-top-style: dashed;/*上框線樣式 虛線*/
border-right-style: solid;/*右框線樣式 實線*/
border-bottom-style: dotted;/*下框線樣式 點狀線*/
border-left-style: double;/*左框線樣式 雙畫線*/
border-top-color: #33CCFF;/*上框線顏色 */
border-right-color: #CCCC00;/*右框線顏色*/
border-bottom-color: #FF6633;/*下框線顏色*/
border-left-color: #6666CC;/*左框線顏色*/
}
|
1.選擇功能表「文字／CSS樣式／新增」，選取器類型─標籤（重新定義指定標籤的外觀）。 訪客無法瀏覽此圖片或連結，請先 註冊 或 登入會員 。
2.另存新檔：檔名訪客無法瀏覽此圖片或連結，請先 註冊 或 登入會員 。 訪客無法瀏覽此圖片或連結，請先 註冊 或 登入會員 。
3.設定邊框 訪客無法瀏覽此圖片或連結，請先 註冊 或 登入會員 。
|
參考網站：OECSpace 訪客無法瀏覽此圖片或連結，請先 註冊 或 登入會員 。
