3school 知識點隨筆記錄(HTML列表)
創建表格
// 每個表格由 table 標簽開始。
// 每個表格行由 tr 標簽開始。
// 每個表格數據由 td 標簽開始。
示例 :
<html>
<body>
<h4>一列:</h4>
<table border="1">
<tr>
<td>100</td>
</tr>
</table>
<h4>一行三列:</h4>
<table border="1">
<tr>
<td>100</td>
<td>200</td>
</tr>
</table>
<h4>兩行三列:</h4>
<table border="1">
<tr>
<td>100</td>
<td>200</td>
<td>300</td>
</tr>
<tr>
<td>400</td>
<td>500</td>
<td>600</td>
</tr>
</table>
</body>
表格的表頭使用<th>標簽進行定義,顯示為粗體字,以及空單元格性質
caption : 創建標題
colspan :橫向占單元格數
rowspan :縱向占單元格數
cellpadding :單元格邊距,即單元格大小
cellspacing :單元格間距
background :添加目標路徑的背景顏色,或者直接使用 bgcolor="red" 定義顏色
align="left" :定義單元格內容靠左
align="right" :定義單元格內容靠右
frame : 定義表格框架 box : 單線框架包裹
above : 只有上面一條線
below : 只有下面一條線
hside : 上下兩條線
vsides : 左右兩條線
示例 :
<table border="1" // 邊框的屬性格式
cellpadding="10" // 邊框邊距大小
cellspacing= "10" // 單元格間距
background = " C:\Users\Administrator\Desktop\timg.jpg " // 表格背景顏色 >
<caption>我的標題</caption> // 標題顯示
<tr>
<th colspan="2" // 表示橫向表頭占兩個單元格 >Another Heading</th> // 表頭顯示
</tr>
<tr>
<td bgcolor = "red" // 單元格背景顏色
align="right" // 單元格內容靠右 >
你好
</td>
<td>世界</td>
</tr>
<tr>
<th> 姓名 </th>
<td> 張三 </td>
<tr>
<th rowspan="2" // 表示縱向表頭占兩個單元格 > 電話 </th>
<td></td> // 顯示空表格,但是沒有邊框和位置,可以添加空格占位符顯示邊框<td> </td>
</tr>
<tr>
<td>hello</td>
</tr>
</table>
表格內鑲嵌表格
示例 :
<html>
<body>
<table border="1">
<tr>
<td>
<p>這是一個段落。</p>
<p>這是另一個段落。</p>
</td>
<td>這個單元包含一個表格:
<table border="1"> // 表格內創建新的表格
<tr>
<td>A</td>
<td>B</td>
</tr>
<tr>
<td>C</td>
<td>D</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
無序和有序列表
ul : 無序列表
ol : 有序列表
dl : 自定義列表
示例 :
<html>
<body>
<ol start="50" // 定義序列號從50開始 > // 定義有序列表,把 "ol" 改為 " ul " 即為無序列表
<li>咖啡</li>
<li>茶</li>
<li>牛奶</li>
</ol>
</body>
</html>
自定義列表以 <dl> 標簽開始。每個自定義列表項以 <dt> 開始。每個自定義列表項的定義以 <dd> 開始。
示例 :
<dl> // 自定義列表
<dt>Coffee</dt> // 列表項目
<dd>Black hot drink</dd> // 列表項目註釋及定義
<dt>Milk</dt>
<dd>White cold drink</dd>
</dl>
3school 知識點隨筆記錄(HTML列表)