一、列表

1.1 什么是列表標簽？

作用：給一堆數據添加列表語義，也就是告訴搜索引擎告訴瀏覽器這一對數據是一個整體

無序列表---unordered-list(最多)：新聞列表、導航、商品列表

作用:給一堆數據添加列表語義里面所有數據沒有優先之分只是列舉出來

可以列舉圖片文字視頻```

ul里面有屬性 type=“circle/square/disc” ?清除前面符號 list-style：none；

可以在li中嵌套ul-li

有序列表---ordered-list(最少)

作用：給一堆添加語義，并且有先后之分```

``` ?type=“1/A/a/I” start=“數字‘//css做

自定義列表definition-list(其次):做網站底部信息

作用?:和無序列表語義，給添加語義 。先通過dt標簽定義列表中的所有標題，然后再通過dd標簽給每個標題添加描述信息```

```dt用來定義標題

------無序列表注意點：

1)一定要記住ul標簽是用來給一堆數據添加列表語義的而不是用來添加小圓點的

2)ul標簽和li標簽是一個整體，是一個組合所有一般情況下ul標簽和li標簽都是一起出現

3)ul里面不推薦包含其他標簽

補充：br標簽里面的屬性width規定寬度

注意：雖然通過標簽屬性也能修改樣式，但是在企業開發中千萬不要這樣干前面我們說過ul中最好只放li標簽，但是在企業開發中。li標簽中內容可能會很復雜，所以我們可以繼續在li標簽中添加其他標簽來豐富我們的界面。

總結：

1.一定要記住ul標簽只放li標簽

但是li中可以放其他標簽

eg

• 標題

  段落

• 標題1

• 標題2

-----有序列表 :

-----定義列表注意：1) dl/dt/dd是整體出現一起出現 ，dl 只放dt/dd，

2)推薦使用一個dt對應一個dd

3)為了豐富界面，我們可以在dt/dd中添加其他標簽

大學

但是v哈巴河v不會吧

二、表格使用

其實表格標簽中的table代表整個表格，也就是一堆table標簽就是一個標簽tr為行td為列 表格標簽有一個標簽屬性 這個屬性決定邊框寬度默認為0所以看不到邊框

屬性注意點:

1)寬度和高度屬性：可以給table和td標簽使用

1.1 表格寬度和高度默認是按照內容尺寸來調整的也可以通過

給table標簽設置width/height屬性的方式來手動指定表表格和寬度

td是當前單元格的寬度和高度不影響整個表格的寬度和高度

2)水平對齊和垂直對齊的屬性

其中水平對齊table/tr/td都可以-------垂直對齊只能給tr/td使用

給table設置align=right/left/center控制表格在水平方向的對齊方式

tr設置align，控制行中所有單元格的水平對齊方式

td設置align，控制當前單元格中內容在說方向的對齊方式

注意：如果td中設置align屬性，tr中也設置align，所有單元格按td來

tr設置valign屬性，控制當前行所有單元格中內容垂直對齊

td當前單元格垂直對齊

注意：同時給tr和td設置vailgn以td為準

3)外邊距和內邊距屬性

只能給table使用 外邊距就是單元格與單元格之間的距離。內邊距是單元格的邊框和文字之間的間隙，我們稱之為內邊距默認為1

注意：企業用css修改樣式

表格標題caption作用:標題自動相對于表格的寬度居中

標題單元格標簽

在表格標簽中提供了一個標簽專門用了存儲每一列的標題，這個標簽叫做th標簽，只要將當前列的標題存儲在這個標簽中就會自動居中加粗

注意：1.必須寫在table中且緊跟table中

細線表格 在表格標簽中想通過指定外邊距為0來實現，其實它是將兩條線合并一條線，看上去不舒服

1)給table標簽設置bgcolor=“color”；

2)給tr標簽設置bgcolor；

3)給table標簽設置cellspacing=“1px”；---表格于表格之間距離

由于表格中存儲的數據比較復雜，為了方便管理和提升語義，我們可以對表格中存儲的數據進行分類

4類

1.表格標題

2.表格的表頭信息

3.表格的主體信息

4.表格的頁尾信息

每一列標題

//它是自定義比其他行的高度小

thead：指定表格的表頭信息

tbody：指定表格主體信息

tfoot：指定表格的附加信息

注意：1.如果我們沒有編寫tbody，系統會給我們添加tbody

2.如果指定了thead、和tfoot。那么在修改整個表格的高度時 thead和tfoot有自己默認的高度，不會隨表格的高度變換而變換。

單元格合并

水平方向上的單元格合并

可以給td標簽添加一個rowspan屬性，來制定把某一個單元格當做多個單元格來看待

colspan=“數字”行合并 rowspan=”“；列合并在td中寫合并后還要刪除后面的

//注釋掉

//注釋掉

//注釋掉

注意：合并合并的時他的后面或者下面

總結

以上是生活随笔為你收集整理的html5列表标签代码,HTML5列表标签和表格标签(示例代码)的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。