1. 程式人生 > >html的知識點快速記憶(二)

html的知識點快速記憶(二)

知識點30:表格、表單、列表標籤目的
    表格table:用來顯示、展示表格資料,特別是在後臺引用的時候,顯得非常重要,
    表格建立:table>tr>td,table定義一個表格標籤,tr定義表格中的行,td定義表格中的單元格,必須完整,比較規則。
    列表:用來佈局的
    表單:用來收集使用者資訊的
知識點31:表格屬性---在開始標籤裡去寫,預設屬性值是畫素
    border:定義表格邊框寬度
    width:定義表格的寬
    height:定義表格的高
    align:定義表格在網頁中的水平對齊方式    left 、center、right
    cellspacing:定義單元格與單元格之間的距離,設定為0,單元格之間就是單實線,
    cellpadding: 定義單元格內容與單元格的距離。
    HTML中所有的屬性不存在單位!所以不寫。
知識點32:表頭單元格標籤---<th></th>
    th :表頭單元格一般引用於表格的第一行或第一列,並且顯示會加粗和居中。
知識點33:表格標題標籤---<caption></caption>
    caption :定義表格標題,通常會居中顯示,    且居於表格之上,
    注意寫在緊跟table標籤後面,只存在表格中有意義,其他位置無效。
知識點34:合併單元格---rowspan、colspan,不支援既跨行又跨列合併
    rowspan: 跨行(垂直一排)合併,colspan :跨列(水平一排)合併。
    合併順序 :先上後下,先左後右;
    合併步驟 :①確定合併方式(跨行還是跨列);②確定目標單元格(遵循合併順序原則),確定合併數量;③刪除多餘的單元格(刪除單元格的數量=合併數量-1(合併自身要減去))。
    表格提供了HTML中定義表格式資料的方法。
知識點35:表格結構劃分---題頭、正文、腳註三部分,都用在表格中
    <thead></thead>:用於定義表頭的頭部,注意<thead>內部必須擁有<tr>標籤,
    <tbody></tbody>:用於定義表頭的主體,
    <tfoot></tfoot>:用於定義表頭的腳註。
知識點36:列表標籤---有序列表、無序列表、自定義列表
    列表是用來佈局的,組合自由度更高;容器裡面裝著結構,樣式一致的文字或圖表的一種形式,叫列表,
    無序列表各個列表之間是沒有順序的,ul裡面只能巢狀li,中間放其他標籤是不被允許的,li 相當於一個容器。
    語法:ul>li
知識點37:有序列表---有排列順序的列表
    語法:ol>li
知識點38:自定義列表---常用於對術語或名詞進行描述和解釋
    語法:dl>dt+dd
    dd圍繞dt來解釋說明,dt(自定義標題)、dd(自定義解釋)是並列關係。
知識點39:表單控制元件---form、input、textarea、select、lable
    表單的目的是為了收集使用者資訊,
    在HTML中,一個完整的表單通常由表單控制元件(表單元素)、提示資訊和表單域3個部分組成,
    <input type=""  name=""  value="預設屬性值"  />    為單標籤
    type型別:text    單行文字輸入框
        passward    密碼輸入框
        radio    單選框    通過設定相同name值來生效
        checkbox    複選框    通過設定相同name值來生效
        button    普通按鈕    需要寫value值
        submit    提交按鈕
        reset    重置按鈕
        image    影象按鈕    語法:<input type="image" src="地址路徑" />
        file    檔案域    語法:<input type="file"  />
        email    郵箱框    語法:<input type="email">
        date    日期按鈕    語法:<input type="date">
        phone    電話框
知識點40:表單屬性
    type:表單型別
    checked:表示預設選中狀態,checke="checked"    
    name:屬性作用就為後臺區別哪個表單,因為表單太多了,
    單選按鈕如何實現單選效果,需要通過設定相同的name屬性進行分組
    value:預設的屬性值文字
    size:表示input在頁面中顯示寬度,正整數
    maxlength:表示輸入字元長度正整數
    required:表示輸入不能為空
    placeholder: 表示提示輸入文字/內容
知識點41:lable標籤--為input元素定義標註(標籤)
    語法1:<lable>  <input  type="" />  </lable>    直接包含
    語法2:<lable  for="nc">  暱稱:</lable>   <input  type=""  id="nc"/>    通過for和id來控制
    作用:用於繫結一個表單元素,提升使用者體驗。
知識點42:textarea文字域控制元件---雙標籤
    可以建立多行文字,cols="每行中的字元數",rows="文字的行數"
    文字域中內容會原樣顯示在頁面上,注意字元
知識點43:select下拉列表---使用者選擇
    語法:<select>   <option> </option>  </select>
    select裡至少包含一對option
    selected="selected"表示預設選中,用在相應的option裡。
知識點44:form表單域標籤---將使用者資訊通過表單域傳遞給伺服器
    語法:<form action="" >     </form>
    action: url地址,用於指定接收並處理表單資料的伺服器程式的URL地址
    method:get/post (post安全性較高,不顯示內容) 設定表單資料的提交方式
    name: 用來識別區分哪個表單。
    元素屬性使用雙引號語法。

完!