h5-經常使用標籤

h5-經常使用標籤

h5：語義化標籤

 

語義化標籤的好處：

           1)    html語義化讓頁面的內容結構化，結構更清晰，便於對瀏覽器、搜索引擎解析;
            2)    即便在沒有樣式CSS狀況下也以一種文檔格式顯示，而且是容易閱讀的;
            3)    搜索引擎的爬蟲也依賴於HTML標記來肯定上下文和各個關鍵字的權重，利於SEO;
            4)    使閱讀源代碼的人對網站更容易將網站分塊，便於閱讀維護理解。

定義一個導航
            nav  導航標籤
            header  頭部
            footer  底部
            hgroup  標題組
            section 劃分區域的
            article 主題內容
            aside   主題內容的附屬信息
            figure  定義媒體信息
            figcaption figure媒體的標題
            time    定義日期（datetime time標籤上面的屬性）

     <time datetime="2019-02-14">情人節</time>有約會嗎

html5中的

datalist下拉列表

        <datalist id="vlist">
            <option value="百度">百度</option>
            <option value="千度">千度</option>
            <option value="京東">京東</option>
            <option value="淘寶">淘寶</option>
        </datalist>

        <details open>  <!--屬性和屬性值一致的時候，能夠只寫一個open="open"   open-->
            <summary>人人教育</summary>
            <p>前端培訓很專業</p>
        </details>

dialog對話

        <dialog open>
            <dt>老師在嗎？</dt>
            <dd>1+1=？</dd>
            <dt>學生</dt>
            <dd>這個問題不會嗎？你問的問題我無法接啊？</dd>
        </dialog>

address  地址信息，起提示做用

mark 標記，背景顏色默認是黃色，警告黃

progress 進度條

pre 能夠按照指定的結構輸出

sub 設置下標        例如H2O
sup 設置上標        例如2的2次方

 h5表單

action 提交地址

method 數據提交方式   get ，post

autofocus 自動獲取焦點

required 驗證信息

html5中表單新增的

            <input type="color" /> <!--取色器-->
            <input type="tel" />  <!--在手機端會調取數字鍵盤-->
            <input type="number" /> <!--能夠增減數字的文本框-->
            <input type="email" /> <!--在手機端會調取鍵盤@-->            
            <input type="date" />  <!--帶年月日的輸入框-->
            <input type="week" />  <!--周-->
            <input type="month" /> <!--月-->
            <input type="url" />   <!--在手機端會調取帶網址的輸入框-->
            <input type="search" />  <!--搜索框-->
            <input type="datetime" /> <!--時間標籤，這個框輸入的是時間-->            <input type="range" value="0" /> <!--控制調節按鈕-->