前端HTML第二天學習筆記
阿新 • • 發佈:2020-10-14
#HTML學習第二天筆記:
- 表格常用標籤及屬性:
表格的基本語法:
1>三個基本的表格標籤如下:
2>表頭單元格標籤:
在大多數表格中,第一行通常用來顯示標題而不是實際的資料,這樣可以方便使用者閱讀
和理解下方表格資料的含義;
表頭單元格的標籤是 th 。
th 標籤同樣可以存放內容;
相比較 td 標籤,內容會被加粗並且居中顯示。
3>表格的常用屬性:
4>表格結構標:
thead 定義表格頭部(標題行),必須擁有 tr 標籤,一般位於第一行;
tbody 定義表格的主體,通常包含標題行下方的表格資料區域。
thead 和 tbody 只是用來劃分表格結構的,用來區分標題行和資料區域,不能夠存放單元格的內容
跨行合併( rowspan ),把多個行的單元格合併 → 縱向合併;
跨列合併( colspan ),把多個列的單元格合併 → 橫向合併。
明確合併方式(跨行 / 跨列)
找到目標單元格 td 增加合併單元格屬性
跨行 rowspan=“x” (縱向);
跨列 colspan=“y” (橫向);
刪除多餘的單元格。
合併單元格的屬性寫在目標單元格標籤上。
標籤總結:
- 三種列表:
列表就是用來佈局的,可以整齊、有序的展示資料,用列表做佈局會更加自由和方便
我們一共要學習3種列表
無序列表: ul
有序列表: ol
自定義列表: dl
1>無序列表:
2>有序列表:
有序列表的的基本語法與無序列表基本一致,只需要把 ul 替換成 ol 即可:
有序列表除了序號之外,與無序列表的使用及注意事項沒有區別;
3>自定義列表:
網站首頁下方的網站導航通常可以使用自定義列表來實現
dt 存放關鍵詞(term)的內容;
dd 存放前面 dt 關鍵詞對應的列表項內容。
列表總結
- 表單
表單在開發網站時,可以使用表單收集使用者資訊,統一提交給後臺處理
表單由那幾部分組成?
1)表單域:整個表單區域,統一彙總要收集的資料,統一提交給後臺,例如包含姓名、性 別等完整的使用者資訊記錄;
2)表單控制元件(表單元素):與使用者互動,允許使用者輸入或者選擇單個具體的資訊,例如姓 名;
1>表單域:
實現使用者資訊的收集與傳遞,例如收集使用者的完整資訊,然後統一傳遞給後臺
2>input 標籤:
type 屬性是 input 標籤的必須屬性,用來指定 input 控價的型別
3>select 下拉表單:
使用 selected 屬效能夠預設選中某一項;
與 checked 類似,在 H5 中 selected=“selected” 可以簡寫為 selected 。
4> textarea 文字域標籤:
如果需要輸入大量文字並且需要換行時,可以使用文字域,例如:個人簡介、留言板、評論。
文字域雙標籤內部的空格會被完全還原,所以開始標籤和結束標籤需要寫在一行。
表格標籤
表單標籤及屬性
input 標籤的常用屬性:
input 標籤 type 的常用屬性值: