HTML5基礎知識點總結（三）---表格與列表
阿新 • • 發佈：2021-01-18
一、表格
基本語法：
<table>
<!-- tr 行 td 列 -->
<tr>
<td>第一行第一列</td>
<td>第一行第二列</td>
</tr>
<tr>
<td>第二行第一列</td>
<td>第二行第二列</td>
</ 其內部的單元格里面的值同樣可以使用CSS中的文字、文字、邊框的樣式
例項如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
table{
/* 設定邊框的大小、型別（實線）、顏色 */
border: 1px solid black; 結果：
**注意：**合併單元格的實質是將要合併的單元格擴大，其後面的值依次後移。
二、列表
列表分為有序列表和無序列表
有序列表格式：
<!-- reversed type=""代表有序列表的序號型別，有數字、小寫英文字母、大寫英文字母、希臘字母等，預設為數字(即type="1") -->
<!-- start="" 代表序號開始的位置，預設為第一個 -->
<ol reversed type="A" start="10">
<li>第一</li>
<li>第二</li>
<li>第三</li>
<li>第四</li>
</ol>
結果：
無序列表格式：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
ul{
/* 無序列表前方有預設的黑色實心圓點 */
/* 取消形狀 兩者都可
list-style: none;
list-style-type: none; */
/* 修改圓點型別 circle 空心圓 square 實心方塊 */
/* list-style-type: circle; */
/* 自定義形狀
list-style-image: url(./img/); */
}
</style>
</head>
<body>
<ul>
<li>動物</li>
<li>貓</li>
<li>狗</li>
<li>雞</li>
</ul>
</body>
</html>
結果：
有序列表和無序列表同樣可以使用CSS裡面的文字、文字、邊框的樣式