請建立一份HTML文件，檔名為link.html。請用VS Code編輯。
使用<table>建立一份連結清單如下。
表格外的第一行大標題為<h1>。
表格第一列標題使用<th>，底色為粉紅色(pink)。
表格第一列以下的其他列底色16進制色碼(hex color code)為#eee444。
每一個連結名稱文字要加上超連結<a>，連結的位址即為後面的連結位址，點擊連結時要在新的瀏覽器頁籤開啟，例如「Google搜尋」。
使用外部樣式表(External style sheet)來套用CSS。
提示：
HTML <table> 表格元素 Table Elements 簡介；
HTML 超連結元素Hyperlink Elements <a>簡介。
解答
link.html
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css"/>
</head>
<body>
<h1>我的常用連結</h1>
<table style="solid 1px; width:500px;">
<thead>
<tr>
<th>連結名稱</th>
<th>連結位址</th>
</tr>
</thead>
<tbody>
<tr>
<td><a href="https://www.google.com.tw/">Google搜尋</a></td>
<td>https://www.google.com.tw/</td>
</tr>
<tr>
<td><a href="https://www.facebook.com/">臉書 Facebook</a></td>
<td>https://www.facebook.com/</td>
</tr>
<tr>
<td><a href="https://matthung0807.blogspot.com/">菜鳥工程師肉豬</a></td>
<td>https://matthung0807.blogspot.com/</td>
</tr>
</tbody>
</table>
</body>
</html>
style.css
table, th, td {
border:solid 1px;
}
th {
background-color:pink;
}
tr {
background-color:#eee444;
}
沒有留言:
張貼留言