HTML-1（study）

*******HTML********

**Web服務本質**

import socket

sk = socket.socket()

sk.bind(("127.0.0.1", 8080))

sk.listen(5)

while True:

conn, addr = sk.accept()

data = conn.recv(8096)

conn.send(b"HTTP/1.1 200 OK\r\n\r\n")#http協議簡化

conn.send(b"<h1>Hello world!</h1>")#發送內容

conn.close()

sk.close()

瀏覽器發送請求-->HTTP協議-->服務器接受請求-->服務端返回響應-->服務端把HTML文件內容發送給瀏覽器-->瀏覽器渲染頁面

What HTML?

*超文本標記語言（Hypertext Markup Language，HTML）是一種用于創建網頁標記語言

*本質上是瀏覽器可識別的規則，我們按照規則寫網頁，瀏覽器根據規則渲染我們的頁面。

對于不同的瀏覽器，對于同一個標簽可能會有不同的解釋。（兼容性問題）

*網頁文件的擴展名：.html或.htm

*HTML是一種標記語言，他不是一種編程語言，HTML使用標簽來描述網頁。

****HTML文檔結構****

*最基本的HTML文檔**

<!DOCTYPE html>

<head>

</head>

<body>

</body>

</html>

#解釋

1.<!DOCTYPE html>聲明為HTML5文檔

2.<html></html>是文檔的開始標記語言和結束標記，是HTML頁面的根本元素，在他們之間是文檔的頭部(head)和主題(body)

3.<head></head>定義了HTML文檔的開頭部分。他們之間的內容不會在瀏覽器的文檔窗口顯示。包含了文檔的元（meta）數據

4.<title></title>定義了網頁標題，在瀏覽器標題欄顯示

5.<body></body>之間的文本是可見的網頁主體內容

注意：

對于中文網頁需要使用<meta charset='utf-8'>聲明編碼。否則會出現亂碼。這些瀏覽器會設置GBK為默認編碼，則需要我們設為

****HTML標簽格式****

*HTML標簽是由尖括號包圍的關鍵字

*HTML標簽通常是成對出現的，比如：<div>和</div>，第一個標簽是開始，第二個標簽是結束。結束標簽會有斜線。

*也有一部分標簽是單獨呈現的，比如：<br/>、<hr/>、<img src="1.jpg" />等。

*標簽里面可以有若干屬性，也可以不帶屬性。

****標簽的語法

<標簽名屬性1=“屬性值1” 屬性2=“屬性值2”……>內容部分</標簽名>

<標簽名屬性1=“屬性值1” 屬性2=“屬性值2”…… />

幾個很重要的屬性：

id：定義標簽的唯一ID，HTML文檔樹中唯一

class：為html元素定義一個或多個類名（classname）(CSS樣式類名)

style：規定元素的行內樣式（CSS樣式

****HTML注釋

****<!DOCTYPE>標簽****

<!DOCTYPE> 聲明必須是HTML文檔的第一行，位于<html>標簽之前

<!DOCTYPE> 聲明不是HTML標簽，他是指示web瀏覽器關于頁面使用哪個HTML版本進行編寫的指令

****HTML常用標簽****

**head內常用的標簽**

1.<title></title> 定義網頁的標題

2.<style></style> 定義內部樣式表

3.<script><script>定義JS代碼或引入外部JS文件

4.<link/> 引入外部樣式文件

5.<meta/>定義網頁原信息

****Meta標簽

Meta標簽介紹：

meta標簽的組成：meta標簽共有兩個屬性，它們分別是http-equiv屬性和name 屬性，不同的屬性又有不

同的參數值，這些不同的參數值就實現了不同的網頁功能。

1.http-equiv屬性：相當于http的文件頭作用，它可以向瀏覽器傳回一些有用的信息，以幫助正確地顯示

網頁內容，與之對應的屬性值為content，content中的內容其實就是各個參數的變量值。

2.names屬性：主要用于描述網頁，與之對應的屬性值為content，content中的內容主要是便于搜索引擎

機器人查找信息和分類信息用的

******body內常用表標簽******

****基本標簽（塊級標簽和內聯標簽）****

<br>

<hr>

****特殊字符****

空格------

>-------->

<--------<

&--------&

￥--------￥

版權(??)---?

注冊(??)---?

****div標簽和span標簽****

div標簽用來定義一個塊級元素，并無實際的意義。主要通過CSS樣式為其賦予不同的表現。

span標簽用來定義內聯(行內)元素，并無實際的意義。主要通過CSS樣式為其賦予不同的表現。

塊級元素與行內元素的區別：

所謂塊元素，是以另起一行開始渲染的元素，行內元素則不需另起一行。如果單獨在網頁中插入這兩個元素，不會對頁面產生任何的影響。

這兩個元素是專門為定義CSS樣式而生的。

注意：

關于標簽嵌套：通常塊級元素可以包含內聯元素或某些塊級元素，但內聯元素不能包含塊級元素，它只能包含其它內聯元素。

p標簽不能包含塊級標簽，p標簽也不能包含p標簽。

****img標簽****

****a標簽****

超鏈接標簽

所謂的超鏈接是指從一個網頁指向一個目標的連接關系，這個目標可以是另一個網頁，

也可以是相同網頁上的不同位置，還可以是一個圖片，一個電子郵件地址，一個文件，

甚至是一個應用程序。

什么是URL？

URL是統一資源定位器(Uniform Resource Locator)的縮寫，也被稱為網頁地址，是因特網上標準的資源的地址。

URL舉例

http://www.baidu.com/stu/index.html

http://111.13.100.91/stu/index.html

URL地址由4部分組成

第1部分：為協議：http://、ftp://等

第2部分：為站點地址：可以是域名或IP地址

第3部分：為頁面在站點中的目錄：stu

第4部分：為頁面名稱，例如 index.html

各部分之間用“/”符號隔開。

href屬性指定目標網頁地址。該地址可以有幾種類型：

1.絕對URL-指向另一個站點（不如）

2.相對URL-指向當前站點中確切的路徑（href = 'index.html'）

3.錨URL-指向頁面中的錨（href = '#top'）

target:

1._blank表示在新標簽頁中打開目標頁面

2._self表示在當前標簽頁中打開目標頁面

****列表*****

1.無序列表

</ul>

type屬性：

1.disc（實心圓點，默認值）

2.circle（空心圓圈）

3.square（實行方塊）

4.none（無樣式）

2.有序列表

</ol>

type屬性：

1.1數字列表，默認值

2.A大寫字母

3.a小寫字母

4.I大寫羅馬

5.i小寫羅馬

3.標題列表

<dl>

</dl>

****表格****

表格是一個二維數據空間，一個表格由若干行組成，一行又有若干單元格組成，單元格里面可以

包括文字。列表。圖案。表單。數字符號。預置文本和其它的表格等內容。

表格最重要的目的是顯示表格類數據。

表格類數據是值最適合組織為表格格式（即按行和列組織）的數據

表格基本結構：

<table>

<thead>

<tr>

</tr>

</theaf>

<tbody>

<tr>

</tr>

<tr>

</tr>

</tbody>

</table>

屬性：

1.border：表格邊框

2.cellpadding：內邊距

3.cellspacing：外邊距

4.width：像素百分比（最好通過css來設置長度）

5.rowspan：單元格豎跨多少行

6.colspan：單元格橫跨多少列（即合并單元格）

****form（表單）****

功能；

表單用于向服務器傳輸數據，從而實現用戶與web服務器的交互

表單能夠包含input系列標簽，比如文本字段、復選框、單選框、提交按鈕等等

表單還可以包含textarea、select、fieldest和lable標簽

***表單屬性

1.accept-charset 規定在被提交表單中使用的字符集（默認：頁面字符集）

2.action 規定在何處提交表單的地址（URL）（提交頁面）

3.autocomplete 規定瀏覽器應該自動完成表單（默認：開啟）

4.enctype 規定被提交數據的編碼（默認：url-encoded）

5.method 規定在提交表單時所用的HTTP方法（默認GET）

6.name 規定識別表單的名稱（對于DOM使用：document.forms.name）

7.novalidate規定瀏覽器不驗證表單

8.target規定action屬性中地址的目標（默認_self）

***表單元素

基本概念：

HTML表單是HTML元素中較為復雜的部分，表單往往和腳本、動態頁面、數據處理等功能相結合，因此它是制作動態網站很重要的內容。

表單一般用來收集用戶的輸入信息

表單工作原理：

訪問者在瀏覽有表單的網頁時，可填寫必需的信息，然后按某個按鈕提交。這些信息通過Internet傳送到服務器上。

服務器上專門的程序對這些數據進行處理，如果有錯誤會返回錯誤信息，并要求糾正錯誤。

當數據完整無誤后，服務器反饋一個輸入完成的信息。

******input******

<input>元素會根據不同的type屬性，變化為多種形態

type屬性值表現形式對應代碼

text單行輸入文本<input type="text" />

password密碼輸入框<input type="password" />

date日期輸入框<input type="date" />

checkbox復選框<input type="checkbox" checked="checked" />

radio單選框<input type="radio" />

submit提交按鈕<input type="submit" value="提交" />

reset重置按鈕<input type="reset" value="重置" />

button普通按鈕<input type="button" value="普通按鈕" />

hidden隱藏輸入框<input type="hidden" />

file文本選擇框<input type="file" />

屬性說明：

1.name：表單提交時的“鍵”，注意和id的區別

2.value：表單提交時對應項的值

type = “button”，“reset”，“submit”時，為按鈕上顯示的文本信息

type = “text”，“password”，“hidden“時，為輸入框的初始值

type = ”checkbox“，”radio“，”file“時，為輸相關聯的值

3.checked：radio和checkbox默認被選中的項

4.readonly：text和password設置只讀

5.disabled：所有input均適用

******select標簽******

</select>

</form>

屬性說明：

1.multiple：布爾屬性，設置后為多選，否則默認單選

2.disabled：禁用

3.selected：默認選中該項

4.value：定義提交時的選項值

******lable標簽******

定義：<lable>標簽為input元素定義標注（標記）

說明：

1.label元素不會向用戶呈現任何特殊效果

2.<lable>標簽的for屬性值應當與相關元素的id屬性值相同

<form>

</form>

******textarea多行文本******

默認內容

</textarea>

屬性說明：

1.name:名稱

2.rows:行數

3.cols:列數

4.disable:禁用

站的建站流程

頁面圖例

網頁的結構

WEB標準

WEB標準是網頁制作的標準，它不是一個標準，它是根據網頁的不同組成部分生成的一系列標準。這些標準大部分由W3C起草發布，也有部分標準由ECMA起草發布

（1）W3C( World Wide Web Consortium )萬維網聯盟，創建于1994年是Web技術領域最具權威和影響力的國際中立性技術標準機構；是專門負責網絡標準制定的非贏利組織。制定了結構標準和樣式標準；（2）ECMA：歐洲電腦網商聯合會（廠商協會），制定了行為標準；

計算機語言

HTML

HTML 指的是超文本標記語言 (Hyper Text Markup Language) www萬維網的描述性語言。 XHTML指可擴展超文本標記語言（標識語言）（EXtensible HyperText Markup Language）是一種置標語言，表現方式與超文本標記語言（HTML）類似，不過語法上更加嚴格。 HTML5指的是HTML的第五次重大修改（第5個版本）

HTML發展

編輯器

建立站點

規劃網站的所有內容和代碼
整合資源

文件的命名規范

小寫英文字母、數字、下劃線的組合，
其中不得包含漢字、空格和特殊字符；
必須以英文字母開頭。

HTML開始

1：HTML架構

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
有三種：Strict（嚴格型)、
Trasitional（過渡型）、
Frameset（框架型）

2：HTML5基本結構

3:HTML語言

HTML語言組成

（1）標簽

txt 寫在尖角號<>里的第一個單詞，叫做標記，也叫做標簽，也稱作元素；

（2）屬性

標記和屬性用空格隔開，屬性和屬性值用等號連接，屬性值必須放在雙引號內一個標記可以有多個屬性，屬性和屬性之間用空格隔開，屬性不分先后順序

HTML語法

（1）常規標記(雙標記)： <標記名稱屬性1名="屬性1值" 屬性2名="屬性2值" ………… >

（2）空標記（單標記）：<標記名屬性1名="屬性1值" />

常用標簽

1 ：文本標題標簽

文本標題共有6個（h1-h6）
<h1>一級標題</h1>(唯一性,放網站LOGO)
<h2>二級標題</h2>
...
<h6>六級標題</h6>

2:字體傾斜&加粗標記

文本傾斜:
    <i></i>
    <em></em>

文本加粗：
    <b></b>
    <strong></strong>

3：下劃線

<u></u>

4 : 換行&水平線

<br>
<hr>

5：上標&下標

<sup></sup>
<sub></sub>

6 : 段落標記

<p></p>

7 : 字符（小段文本）

<span></span>

8 : （1）無序列表

<ul>
     <li>列表項內容</li>
     <li>列表項內容</li>
     <li>列表項內容</li>
       ........   
</ul>

? （2）有序列表

<ol>
    <li>列表項內容</li>
    <li>列表項內容</li>
    <li>列表項內容</li>
    ........   
</ol>

type:規定列表中的列表項目的項目符號的類型語法：<ol type=“ a"></ol> 1 數字順序的有序列表（默認值）（1, 2, 3, 4）。 a 字母順序的有序列表，小寫（a, b, c, d）。 A 字母順序的有序列表，大寫（A,B,C,D) i 羅馬數字，小寫（i, ii, iii, iv）。 I 羅馬數字，大寫（i, ii, iii, iv）。 start 屬性規定有序列表的開始點。(start的屬性值必須是數字) 語法：<ol start="5"></ol>

? （3）自定義列表

<dl>
     dt></dt>
     <dd></dd>
</dl>

9 : 超鏈接

<a></a>
    屬性：
        href = 'url'
        target = "_blank  /  _self";
        title = '文本提示'

    拓展：
        rel = 'nofollow';

10 : 圖片

<img>
    屬性：
        src = 'url';
        alt = ' 標簽 實例 帶有指定替代文本的圖像'  
        title = '文本提示'
        width = ''
        height = ''
        border = ''

圖片 title 和 alt區別：

alt:
1、alt屬性是考慮到不支持圖像顯示或者圖像顯示被關閉的瀏覽器的用戶，
以及視覺障礙的用戶和使用屏幕閱讀器的用戶。當圖片不顯示的時候，圖片的替換文字。
2、alt屬性值的長度必須少于100個英文字符
3、alt屬性是img標簽的必須屬性，如果沒有特別意義的圖片，可以寫alt=""
4、alt屬性是搜索引擎判斷圖片與文字是否相關的重要依據， alt屬性添加到img主要的目的才是為了SEO
title:
1、title屬性并不是必須的。
2、title屬性規定元素的額外信息，有視覺效果，當鼠標放到文字或是圖片上時有文字顯示。
3、title屬性并不作為搜索引擎抓取圖片的參考，更多傾向于用戶體驗的考慮。

11 : 相對路徑

（同級）
1)當當前文件與目標文件在同一目錄下，直接書寫目標文件的文件名+擴展名；
（上級找下級）
2)當當前文件與目標文件所處的文件夾在同一目錄下，寫法如下：
文件夾名/目標文件全稱+擴展名；
（下級找上級）
3)當當前文件所處的文件夾和目標文件在同一目錄下，寫法如下：
../目標文件文件名+擴展名；

12 ： DIV

13 : HTML注釋

<!-- 注釋 -->

表格

1 : 表格基本結構

<table>
    <tr>
        <td></td>
        <td></td>
    </tr>
</table>

<!-- 
    table 為表格
    tr 行
    td 列（每一個單元格）
-->

2：表格的html屬性

1）width="表格的寬度"
2）height="表格的高度"
3）border="表格的邊框"
4）bordercolor="邊框色"
5）cellspacing="單元格與單元格之間的間距"
6）cellpadding=“單元格與內容之間的距離"
7）align="表格水平對齊方式"
   取值：left、right、center、
   valign=“垂直對齊” top\bottom\middle
8）合并單元格屬性：(td)
  合并列： colspan=“所要合并的單元格的列數"
  合并行： rowspan=“所要合并單元格的行數”

3 ：數據行分組

<thead></thead>
<tbody></tbody>
<tfoot></tfoot>

4 ：數據列分組

<colgroup span="value"></colgroup>
<!--span屬性為把幾列分為一組-->

5 ：列標題

<th></th>

6: 表格標題

<caption></caption>

7：表格屬性

1、單元格間距：border-spacing:value; 說明：單元格間距(該屬性必須給table添加) 表示單元格邊框之間的距離，不可取負值 2、合并相鄰單元格邊框：border-collapse:separate/collapse; 說明：合并相鄰單元格邊框 (該屬性必須給table添加) separate(邊框分開)默認值； collapse(邊框合并) 3、無內容時單元格的設置：empty-cells:show/hide; 說明：定義當單元格無內容時，是否顯示該單元格的邊框區域；show：顯示；hide：隱藏； 4、顯示單元格行和列的算法(加快運行的速度)： table-layout:auto/fixed;

本文轉自知乎號：千鋒HTML5學院

TML（英文Hyper Text Markup Language的縮寫）中文譯為“超文本標簽語言”，主要是通過HTML標簽對網頁中的文本、圖片、聲音等內容進行描述。

1 HTML骨架格式

日常生活的書信，我們要遵循共同的約定。

同理：HTML 有自己的語言語法骨架格式：

<HTML>   
    <head>     
        <title></title>
    </head>
    <body>
    </body>
</HTML>

html結構：包括head body
html標簽是以尖括號包圍的關鍵字
html標簽通常是成對出現的，有開始就有結束，包含成對標簽、獨立標簽
html通常都有屬性，格式：屬性名＝“屬性值”(多個屬性之間空格隔開)
html標簽不區分大小寫,建議小寫

2 html基本標簽

HTML標簽

作用：所有HTML中標簽的一個根節點。

head標簽

作用：用于存放：title,meta,base,style,script,link

注意：在head標簽中我們必須要設置的標簽是title

title標簽

作用：讓頁面擁有一個屬于自己的標題。

body標簽

作用：頁面在的主體部分，用于存放所有的HTML標簽：p,h,a,b,u,i,s,em,del,ins,strong,img

3 顏色的表示方式

color:文本的顏色
bgcolor:背景色
background:背景圖片

第一種方式：使用顏色名稱: 僅僅有16種顏色名可用英文字母，其余的要用16進制值。

aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, yellow

第二種方式：RGB模式

第三種：十六進制

#000000 #ffffff #325687 #377405

4 文檔類型<!DOCTYPE>（重點）

<!DOCTYPE html>這句話就是告訴我們使用哪個html版本，我們使用的是 html 5 的版本。 html有很多版本，那我們應該告訴用戶和瀏覽器我們使用的版本號。

標簽位于文檔的最前面，用于向瀏覽器說明當前文檔使用哪種 HTML 或 XHTML 標準規范，必需在開頭處使用標簽為所有的XHTML文檔指定XHTML版本和類型，只有這樣瀏覽器才能按指定的文檔類型進行解析。

5 HTML標簽的語義化（重點）

所謂標簽語義化，就是指標簽的含義。

為什么要有語義化標簽：方便代碼的閱讀和維護，同時讓瀏覽器或是網絡爬蟲可以很好地解析，從而更好分析其中的內容，使用語義化標簽會具有更好地搜索引擎優化

核心：合適的地方給一個最為合理的標簽。

語義是否良好： 當我們去掉CSS之后，網頁結構依然組織有序，并且有良好的可讀性，不管是誰都能看懂這塊內容是什么。

遵循的原則：先確定語義的HTML ，再選合適的CSS。

6 總結：（重要知識點）

雙標簽

<html></html>
<head></head>
<title></title>
<body></body>
<table></table>
<tr></tr>
<td></td>
<span></span>
<p></p>
<form></form>
<h1></h1>
<h2></h2>
<h3></h3>
<h4></h4>
<h5></h5>
<h6></h6>
<object></object>
<style></style>
<b></b>
<u></u>
<strong></strong>
<i></i>
<div></div>
<a></a>
<script></script>
<center><center>

單標簽

<br>
<hr>
<img>
<input>
<param>
<meta>
<link>

排版標簽

1.注釋標簽：<!–注釋–>
-------------------------------------
2.換行標簽：<br/>
-------------------------------------
3.段落標簽：<p>文本文字
   特點：段與段之間有行高
   屬性：align對齊方式
           (left：左對齊 center：居中 right：右對齊)
-------------------------------------
4.水平線標簽:<hr/>
   屬性:
        width：水平線的長度(兩種:第一種:像素表示；第二種，百分比表示)
        size: 水平線的粗細 (像素表示，例如：10px)
        color: 水平線的顏色
        align:水平線的對齊方式(left：左對齊 center：居中 right：右對齊)
-------------------------------------
5.容器標簽（重點）
     <div>:塊級標簽，獨占一行，換行
     <span>:行級標簽，所有內容都在同一行作用
     <div>:主要是結合css頁面分塊布局
     <span>:進行友好提示信息

標題標簽 (熟記)

為了使網頁更具有語義化，我們經常會在頁面中用到標題標簽，HTML提供了6個等級的標題，隨著數字增大文字逐漸變小，字體是加粗的，內置字號，默認占據一行；

<h1>、<h2>、<h3>、<h4>、<h5>和<h6>

列表標簽

容器里面裝載著文字或圖表的一種形式，叫列表。列表最大的特點就是整齊、整潔、有序

無序列表 ul （重點）

無序列表標簽： <ul></ul>
    屬性：type :三個值，分別為：
           circle(空心圓) ,disc(默認,實心圓),square(黑色方塊)
    列表項：<li></li>
注意：
<ul></ul>中只能嵌套<li></li>，直接在<ul></ul>標簽中輸入其他標簽或者文字的做法是不被允許的。
<li>與</li>之間相當于一個容器，可以容納所有元素。

無序列表會帶有自己樣式屬性，放下那個樣式，一會讓CSS來！

有序列表 ol

有序列表標簽：<ol>
      屬性：type：1、A、a、I、i（數字、字母、羅馬數字）
      列表項： <li></li>

定義列表dl

\dl>
<dt>名詞1
<dd>名詞1解釋1
<dd>名詞1解釋2
…
<dt>名詞2
<dd>名詞2解釋1
<dd>名詞2解釋2
…
</dl>

dl>
名詞1
名詞1解釋1
名詞1解釋2
... 名詞2
名詞2解釋1
名詞2解釋2
...

圖片標簽

獨立標簽

屬性:
src：圖片地址： 相對路徑 （同一個網站） 絕對路徑 （不同網站）
width:寬度height:高度border:邊框align:對齊方式，代表圖片與相鄰的文本的相當位置（有三個屬性值：top middle bottom）
alt:圖片的文字說明hspace 和 vspace 設定圖片邊沿上下左右空白，以免文字或其它圖片過于貼近

鏈接標簽

超鏈接可以是文本，也可以是一幅圖像，您可以點擊這些內容來跳轉到新的文檔或者當前文檔中的某個部分。（不僅可以創建文本超鏈接，在網頁中各種網頁元素，如圖像、表格、音頻、視頻等都可以添加超鏈接）

屬性：
href:跳轉頁面的地址(跳轉到外網需要添加協議)；
name:名稱，錨點(回到錨點: 頂部，底部，中間)，在訪問錨點的書寫格式:#name的值
target:_self(自己) _blank(新頁面，之前頁面存在) _
__parent top 默認
self_search相等于給頁面起一個名字，如果再次打開時，如果頁面存在，則不再打開新的頁面。可以是任意名字。

如果當時沒有確定鏈接目標時，通常將鏈接標簽的href屬性值定義為“#”(即href="#")，表示該鏈接暫時為一個空鏈接。

在線咨詢

上一篇：備存：各種分割線的Html代碼
下一篇：JavaScript中輸出方法

您的項目需求

*請認真填寫需求信息，我們會在24小時內與您取得聯系。

整合營銷服務商

HTML-1（study）

站的建站流程

頁面圖例

網頁的結構

WEB標準

計算機語言

HTML

HTML發展

編輯器

建立站點

文件的命名規范

HTML開始

1：HTML架構

2：HTML5基本結構

3:HTML語言

常用標簽

1 ： 文本標題標簽

2:字體傾斜&加粗標記

3：下劃線

4 : 換行&水平線

5：上標&下標

6 : 段落標記

7 : 字符 （ 小段文本 ）

8 : （1） 無序列表

9 : 超鏈接

10 : 圖片

圖片 title 和 alt區別：

11 : 相對路徑

12 ： DIV

13 : HTML注釋

表格

1 : 表格基本結構

2：表格的html屬性

3 ： 數據行分組

4 ： 數據列分組

5 ： 列標題

6: 表格標題

7： 表格屬性

您的項目需求

1 ：文本標題標簽

7 : 字符（小段文本）

8 : （1）無序列表

3 ：數據行分組

4 ：數據列分組

5 ：列標題

7：表格屬性