整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
例
帶有 <thead>、<tfoot> 和 <tbody> 元素的 HTML 表格：
<table border="1">
<thead>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
</thead>
<tfoot>
<tr>
<td>Sum</td>
<td>0</td>
</tr>
</tfoot>
<tbody>
<tr>
<td>January</td>
<td>0</td>
</tr>
<tr>
<td>February</td>
<td></td>
</tr>
</tbody>
</table>
瀏覽器支持
所有主流瀏覽器都支持 <thead> 標簽。
標簽定義及使用說明
<thead> 標簽用于組合 HTML 表格的表頭內容。
<thead> 元素應該與 <tbody> 和 <tfoot> 元素結合起來使用，用來規定表格的各個部分（表頭、主體、頁腳）。
通過使用這些元素，使瀏覽器有能力支持獨立于表格表頭和表格頁腳的表格主體滾動。當包含多個頁面的長的表格被打印時，表格的表頭和頁腳可被打印在包含表格數據的每張頁面上。
<thead> 標簽必須被用在以下情境中：作為 <table> 元素的子元素，出現在 <caption>、<colgroup> 元素之后，<tbody>、 <tfoot> 和 <tr> 元素之前。
提示和注釋
注釋：<thead> 元素內部必須包含一個或者多個 <tr> 標簽。
提示：<thead>、<tbody> 和 <tfoot> 元素默認不會影響表格的布局。不過，您可以使用 CSS 來為這些元素定義樣式，從而改變表格的外觀。
HTML 4.01 與 HTML5之間的差異
在 HTML 5 中，不再支持 HTML 4.01 中 <thead> 標簽的任何屬性。
屬性
| 屬性 | 值 | 描述 |
|---|---|---|
| align | rightleftcenterjustifychar | HTML5 不支持。定義 <thead> 元素中內容的對齊方式。 |
| char | character | HTML5 不支持。規定 <thead> 元素中內容根據哪個字符來對進行文本對齊。 |
| charoff | number | HTML5 不支持。規定 <thead> 元素中內容的第一個對齊字符的偏移量。 |
| valign | topmiddlebottombaseline | HTML5 不支持。規定 <thead> 元素中內容的垂直對齊方式。 |
全局屬性
<thead> 標簽支持 HTML 的全局屬性。
事件屬性
<thead> 標簽支持 HTML 的事件屬性。
如您還有不明白的可以在下面與我留言或是與我探討QQ群308855039，我們一起飛！
續一周沒怎么更新了，今天我們繼續HTML的學習，表格標簽。表格是實際開發中常用的一種標簽類型，會說到表格標簽的主要作用和基本語法。
主要作用: 表格主要用于顯示、展示數據，因為它可以讓數據展示的非常規整，可讀性非常好，特別是后臺展示數據的時候，能夠熟練運用表格非常重要。一個清爽簡約的表格可以把復雜的數據表現的很簡單。表格不是用來布局頁面的，而是用來展示數據的。
表格的基本語法: <table><tr><td></td></tr></table>
<table></table>用來定義表格標簽
<tr></tr>用于定義表格中的行，嵌套在<table>標簽中使用
<td></td>用于定義表格中的單元格，嵌套在<tr>標簽中使用，字母td指表格數據(table data),即數據單元格的內容。
我們來展示一個例子，比如 數據庫中有三個字段，分別為 姓名 性別和年齡，如果想用前端將這三個字段的數據展示出來，應該怎么操作呢？
先看效果:
然后我們看下代碼:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>20210829---</title>
</head>
<body>
<table>
<tr> <td>姓名</td> <td>性別</td> <td>年齡</td> </tr>
</table>
</body>
</html>
這次開始使用vs code來編輯代碼了，感覺比sublime line高級一些，但是相對的也麻煩點。可以看到，在前端頁面展示了 姓名、性別和年齡。然后我們添加一行數據，看效果:
民族英雄黃飛鴻如果還活著，應該也是一位非常高壽的宗師了。多加幾個數據
讓我們看看代碼有什么不同
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>20210829---</title>
</head>
<body>
<table>
<tr> <td>姓名</td> <td>性別</td> <td>年齡</td> </tr>
<tr> <td>黃飛鴻</td> <td>男</td> <td>188</td> </tr>
<!--再多創建幾個數據-->>
<tr><td>鬼腳七</td> <td>男</td> <td>186</td> </tr>
<tr><td>梁寬</td> <td>男</td> <td>33</td> </tr>
</table>
</body>
</html>
可以看到，就是將之前的數據進行了復制而已。
接著我們說下表頭單元格標簽，一般表頭單元格位于表頭的第一行或第一列，表頭單元格里面的文本內容，加粗居中表示。
<th>標簽表示HTML表格的表頭部分，table head的縮寫
我們先來看下效果:
再看下對應的代碼:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>20210829---</title>
</head>
<body>
<table>
<!--HTML表格的表頭標簽，內容加粗居中展示-->>
<tr> <th>姓名</th> <th>性別</th> <th>年齡</th> </tr>
<tr> <td>黃飛鴻</td> <td>男</td> <td>188</td> </tr>
<!--再多創建幾個數據-->>
<tr><td>鬼腳七</td> <td>男</td> <td>186</td> </tr>
<tr><td>梁寬</td> <td>男</td> <td>33</td> </tr>
</table>
</body>
</html>
就是將表格表頭那一行的<td>都換成了<th>，可以看到表頭每個字段都已經居中并且加粗了。
最后我們說下表格的屬性，其實表格標簽屬性這部分用的不多，一般都是用css樣式來設置。例如表格的邊框、大小等。我們需要關注的表格屬性目的，有2點:
align 屬性值: left right center 對應表格相對周圍元素的對齊方式
border 屬性值 1或"" (空) 規定表格單元是否有邊框，默認為空，表示沒有邊框
cellpadding 像素值 規定單元邊沿與其內容之間的空白，默認1像素
cellspacing 像素值 規定單元格之間的空白，默認1像素
width 像素值或百分比 規定表格的寬度
我們來看下效果:
來看下代碼:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>20210829---</title>
</head>
<body>
<table align="center" border=1 cellpadding=1 cellspacing=1 width=500>
<!--HTML表格的表頭標簽，內容加粗居中展示-->>
<tr> <th>姓名</th> <th>性別</th> <th>年齡</th> </tr>
<tr> <td>黃飛鴻</td> <td>男</td> <td>188</td> </tr>
<!--再多創建幾個數據-->>
<tr><td>鬼腳七</td> <td>男</td> <td>186</td> </tr>
<tr><td>梁寬</td> <td>男</td> <td>33</td> </tr>
</table>
</body>
</html>
記住，屬性都是在table處添加和修改的，因為我們是對整個table的設置值。
好的，今天就先到這里了，大家周末愉快
一下html中文件標簽和文本標簽的使用
目的是學會使用，所以借助工具可以省好多時間
1.文件標簽：構成html最基本的標簽
html:html文檔的根標簽
head：頭標簽。用于引入html文檔的一些屬性。引入外部的一些資源
title：標題標簽
body：體標簽
<!DOCTYPE html>:html5中定義該文檔是html
2.文本標簽：和文本有關的標簽
注釋:<!-- 注釋內容 –->
<h1> 到<h6>:標題標簽自帶換行的效果
<p>：表示段落的標簽
<br>：換行標簽<br/>和<br>的寫法都不會報錯
<hr>：顯示一條水平線（也是一個自閉和標簽）水平線有一些屬性我們可以控制它的樣式。hr里面表示高度是size而不是height.對齊方式默認是居中的。
<b>：字體加粗
<i>：斜體
<font>:字體標簽（通過屬性來修改字體的字號，大小，顏色，以及字體的樣式）
<center>:文本居然標簽
這里講下網頁下面的版權標簽是如何寫出來的。
3.圖片標簽：用來展示圖片的（圖片也是一個自閉合標簽）
屬性:src:用來指定圖片的位置
什么都不寫默認就是./的形式
../表示上一級目錄
4.列表標簽：
有序列表:ol,li(li表示的是列表的每一項)
無序列表:ul,li
5.鏈接標簽：
a:定義一個超鏈接
屬性：
href:指定訪問資源的URL(統一資源定位符，就是路徑的表示形式)
target：（是目標的意思）指定打開資源的方式
_self:在當前頁面打開
_blank:在空白頁面打開
6.表格標簽：在HTML中的表格只有行的概念，沒有列的概念，將表格以行的形式進行分割，然后再對行進行操作。
table:定義表格
width:表格的寬度
border:邊框
cellpadding:單元格內容左對齊（定義內容和單元格的距離）
cellspacing:邊框合并(定義單元格之間的距離，如果指定為0，單元格的線會合為一條)
bgcolor:背景色
align:表格的對齊樣式
tr:定義行
bgcolor:背景色
align:表格的對齊樣式(是用來修改文本的對齊方式的)
td:定義單元格
colspan:合并列
rowspan:合并行
th:定義表頭單元格
<caption>:表格標題
<thread>:表示表格的頭部分
<tbody>:表示表格的體部分
<tfoot>:表示表格的腳部分
7.塊標簽：div和span是結合css使用的
span:文本信息在一行顯示，行內標簽，內聯標簽(意思就是它不會換行)
div:是會換行的。每一個div占滿一整行。塊級別的標簽
8.語義化標簽：html5中為了提高程序的可讀性，提高了一些標簽
<header>
<footer>
*請認真填寫需求信息，我們會在24小時內與您取得聯系。
