HTML常用標籤

2022 iThome 鐵人賽

DAY 3

自我挑戰組

大學每日任務：攝取新知識及學習紀錄系列第 3 篇

14th鐵人賽

madonnalily

2022-09-18 23:58:41

398 瀏覽

分享至

除了上一篇介紹的基本架構的標籤外，還有一些很常使用到的標籤。

超連結Hyperlinks

是指內由一檔案連接至另一檔案的連結。
標籤定義了一個超鏈接
href全名為Hypertext Reference ，會指定超連結的目標連結，表示連結的目的地。
<a href="網址放這裡 /">超連結顯示文字</a>

<!DOCTYPE html>
<html>
<body>

<h1>超連結</h1>

<p><a href="https://ithelp.ithome.com.tw/articles/10292630">鐵人賽day02</a></p>

</body>
</html>

圖片
標籤用於嵌入圖像鏈接到網頁中，顯示圖片。
src(source)指定圖像的路徑
alt(alternative text )指定圖像的替代文字

<img src="圖片名字.檔名" alt="替代文字">

<!DOCTYPE html>
<html>
<body>

<h2>圖片</h2>
<img src="1.png" alt="讚">

</body>
</html>

表格
<th>…</th>表格欄位的標題，<th> 可以用來替代 <td> 使用
<td>…</td>為單格的內容
<tr>…</tr>為一行表格。
<table>…</table>為整個表格的結構和內容

<!DOCTYPE html>
<html>
<body>
<h2>表格</h2>
<table style="width:20%">
  <tr>
    <td>姓名</td>
    <td>生日</td>
    <td>興趣</td>
  </tr>
  <tr>
    <td>吳美麗</td>
    <td>2000/5/30</td>
    <td>跳舞</td>
  </tr>
  <tr>
    <td>林志明</td>
    <td>1988/10/8</td>
    <td>游泳</td>
  </tr>
  <tr>
    <td>黃成功</td>
    <td>2012/12/12</td>
    <td>睡覺</td>
  </tr>
</table>
</body>
</html>