iT邦幫忙

2026 iThome 鐵人賽

DAY 10
0

學會了清單,那就少不了表格啦!
我覺得清單的形式看上去更輕鬆,但若是比較嚴謹的內容就得搭配更詳細且具體的資訊了。
像是:

| 工具 | 用途 |
| -------------------------------------------- |
| Photoshop | 影像處裡、繪畫 |
| Clip Studio Paint | 繪畫、漫畫 |
| Spine | 動畫(含權重、骨架) |

一如往常地摸索了一下,專門製作表格的標籤應該是像這樣:

<table>
    <tr>
        <td>Photoshop</td>
        <td>修圖</td>
    </tr>
    <tr>
        <td>Spine</td>
        <td>2D 動畫</td>
    </tr>
</table>

其中 <table> 是整個表格,<tr> 可以理解成一列,而 <td> 則是表格裡的一個欄位。

<table> → 表格

<tr> → 一列

<td> → 一個欄位

我發現很多東西都不是單獨存在的。

像前一天寫到的 <ul> 裡面會放 <li>,今天的 <table> 裡面也會再放其他標籤,慢慢組合成完整的內容,相輔相成呢!
如果今天要做一個作品集網站,也可以利用表格整理一些比較適合用「列」和「欄」呈現的資訊。
例如作品名稱、製作時間、使用工具等等。

Day 10,認識 <table>,學著把資料統整進表格裡。


上一篇
Day 9|清單
下一篇
Day 11|表單
系列文
美術生的前端初體驗 : 從畫畫到網頁的30天 共 13 篇
圖片
  熱門推薦
圖片
{{ item.channelVendor }} | {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言