免費AI編程助手
在我們的一個日常的學(xué)習(xí)Web前端知識中遇到的問題肯定的比較多的，那么今天我們就來討論一下在html網(wǎng)頁設(shè)計中如何制作表格？吧！
步驟如下：1.首先我們向在Web前端開發(fā)工具中新建一個 .html 文件（這邊小編用的是HBuilderX），在文件中輸入下面這些代碼就可以看到我們的一個表格的雛形，代碼截圖如下：
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<table >
<thead>
<tr>
<th>標(biāo)題1</th>
<th>標(biāo)題2</th>
<th>標(biāo)題3</th>
<th>標(biāo)題4</th>
<th>標(biāo)題5</th>
<th>標(biāo)題6</th>
</tr>
</thead>
<tbody>
<tr>
<td>單元格1</td>
<td>單元格2</td>
<td>單元格3</td>
<td>單元格4</td>
<td>單元格5</td>
<td>單元格6</td>
</tr>
<tr>
<td>單元格1</td>
<td>單元格2</td>
<td>單元格3</td>
<td>單元格4</td>
<td>單元格5</td>
<td>單元格6</td>
</tr>
<tr>
<td>單元格1</td>
<td>單元格2</td>
<td>單元格3</td>
<td>單元格4</td>
<td>單元格5</td>
<td>單元格6</td>
</tr>
</tbody>
</table>
</body>
</html>
通過代碼的運行我們看到了一個表格的雛形。
2.我們通過使用borde元素在網(wǎng)頁中添加一個值就可以得到一個表格了，代碼截圖如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<table border="1">
<thead>
<tr>
<th>標(biāo)題1</th>
<th>標(biāo)題2</th>
<th>標(biāo)題3</th>
<th>標(biāo)題4</th>
<th>標(biāo)題5</th>
<th>標(biāo)題6</th>
</tr>
</thead>
<tbody>
<tr>
<td>單元格1</td>
<td>單元格2</td>
<td>單元格3</td>
<td>單元格4</td>
<td>單元格5</td>
<td>單元格6</td>
</tr>
<tr>
<td>單元格1</td>
<td>單元格2</td>
<td>單元格3</td>
<td>單元格4</td>
<td>單元格5</td>
<td>單元格6</td>
</tr>
<tr>
<td>單元格1</td>
<td>單元格2</td>
<td>單元格3</td>
<td>單元格4</td>
<td>單元格5</td>
<td>單元格6</td>
</tr>
</tbody>
</table>
</body>
</html>
這樣子我們就完成了一個表格的設(shè)置了。
總結(jié)：
以上就是一個簡單的有關(guān)于怎么在html網(wǎng)頁設(shè)計中如何制作表格的一個代碼和運行的結(jié)果圖，當(dāng)然這個設(shè)置方法肯定不止一個小編只是分享最簡單的給大家進(jìn)行一個了解，當(dāng)然如果我們要對表格進(jìn)行一個裝飾的話也是很簡單的，更多的相關(guān)知識都可以在W3cschool中學(xué)習(xí)和了解。
