溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務(wù)條款》

常用標(biāo)簽dive in

發(fā)布時間:2020-03-10 14:31:01 來源:網(wǎng)絡(luò) 閱讀:785 作者:juliaym 欄目:移動開發(fā)

1. <a>  插入超鏈接

示例
<a target="_blank">百度</a>
屬性
說明
href
可使用絕對路徑或相對路徑,亦可使用錨點(頁面內(nèi)跳轉(zhuǎn))
<a href="#1">jump to "here"</a>
<a name="1">here</a>
target
指定新頁面的打開方式,取值如下:
_blank,在新標(biāo)簽頁中打開
_self,在當(dāng)標(biāo)簽頁中打開

2. 分組元素
① <p> 段落,中間空行
② <div> 無實際效果
③ <blockquote> 段落,前后都縮進 ,中間空行
④ <pre> 按照編輯器內(nèi)的排版格式顯示(不完全一致)
⑤ <hr> 水平分割線
⑥ <ul> 添加無序列表,用法:

<ul>
    <li>第一項</li>  //li的value屬性可設(shè)置此項開始的編號
    <li>第一項</li>
    <li>第一項</li>
</ul>

⑦ <ol> 添加有序列表,start屬性可指定起始編號,type可指定編號形式(a, A, i, I, 1)

⑧ <dl><dt><dd> 生成說明列表,用法:

<dl>
    <dt>這是第一章</dt>
    <dd>第一章第一節(jié)</dd>
    <dd>第一章第二節(jié)</dd>
</dl>

⑨ <figure> 插圖,用法:

<figure>
    <figcaption>這是一張圖片</figcaption>
    <img src="img.png">
</figure>

3. <table> 表格元素,用法:

<table border="1" >
    <caption>這里是標(biāo)題</caption>
    <colgroup>
        <col>                                //占位
        <col background="red;">              //第二列背景色設(shè)為紅色
    </colgroup>
    <tfoot>                                  //表尾-始終在最后一行顯示
        <tr>
            <td colspan="3">共計:1人</td>
        </tr>
    </tfoot>
    <tbody>                                  //表體
        <tr>
            <td>張三</td>
            <td>男</td>
            <td>27</td>
        </tr>
    </tbody>
    <thead>                                 //表頭-始終在第一行顯示
        <tr>
            <th rowspan="3">基本情況</th>
            <th>姓名</th>
            <th>性別</th>
            <th>年齡</th>
        </tr>
    <thead>
</table>

4. 文檔元素,基本無顯示效果,主要表示語義以方便CSS進行樣式標(biāo)記,示例:

<body>
    <header>
        這里放置LOGO,標(biāo)題,導(dǎo)航等
        <hgroup>
            <h2>這是一個大標(biāo)題</h2>
            <h5>這是一個小標(biāo)題</h5>
        </hgroup>
        <nav>這是一個導(dǎo)航</nav>
    </header>
    <section>
        這是一個主題部分
    </section>
    <article>
        <header>...</header>
        <section>...</section>
        <address>這里放置聯(lián)系信息</address>
        <footer>...</footer>
    </article>
    <aside>
        這是一個注釋欄
        <nav>這是注釋欄內(nèi)的導(dǎo)航</nav>
    </aside>
    <footer>
        <h5>這是尾部的小標(biāo)題</h5>
        <address>這里放置聯(lián)系信息</address>
    </footer>

5. 嵌入元素,將外部資源插入到HTML中:

① <img> 插入圖片

示例
<a href="index.html"><img src="img.png" alt="風(fēng)景" width="30" height="20"></a>
屬性
說明
src
圖像的url
width,height寬度,高度
ismap
獲取點擊位置的坐標(biāo),并在請求的地址后添加該坐標(biāo)值
usemap

創(chuàng)建分區(qū)響應(yīng),點擊不同區(qū)域轉(zhuǎn)到不同超鏈接

<img src="img.pne" usemap="#Map">

<map name="Map">

    <area shape="rect" coords="44,33,123,102" href="www.baidu.com" target="_blank" alt="百度">

</map>

② <iframe> 嵌入另一個文檔

示例

<a href="www.baidu.com" target="in">百度</a>

<iframe src="www.soso.com" width="200" height="300" name="in"></iframe>

屬性
說明
src
初始化時顯示的頁面
width,height寬度,高度
name
被其他標(biāo)簽的target屬性引用時,使用的名稱

③ <embed> 嵌入插件內(nèi)容

示例
<embed src="視頻.swf" type="application/x-shockwave-flash" width="600" height="800"></embed>
屬性
說明
src
視頻源
type
視頻類型,自動識別后綴因而可省略
width,height寬度,高度

④ <progress> 進度條,IE10及以上支持,一般通過JS控制進度動態(tài)效果

示例
<progress value="30" max="100"></progress>
屬性
說明
value
進度值
max
進度最大值

⑤ <meter> 類似于進度條,可設(shè)置警示范圍,IE不支持

示例
<meter value="90" min="10" max="100" low="30" high="80"></meter>
屬性
說明
value

進度值

min
最小值,value小于等于該值不顯示
max

最大值

low
下闕值,小于該值進度條變×××
high
上闕值,大于該值進度條變×××


向AI問一下細(xì)節(jié)

免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點不代表本網(wǎng)站立場,如果涉及侵權(quán)請聯(lián)系站長郵箱:is@yisu.com進行舉報,并提供相關(guān)證據(jù),一經(jīng)查實,將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI