html常用标签理解

<div class="jichu">
            基础：<br>
            <h1>这是一个一号标题</h1>
            <h5>这是一个五号标题</h5>
            <p>这是一个段落</p>
            <hr>
            <!-- 注释 -->
        </div>
        <div class="geshi">
            格式：<br>
            首字母缩写 <acronym title="zhang pan">zp</acronym> (H5不再支持) <br>
            定义一个缩写<abbr title="World Health Organization">WHO</abbr> <br>
            <address>
                定义文档作者/所有者的联系信息（address元素的文本通常呈现为斜体。大多数浏览器会在该元素的前后添加换行）
            </address>
            <b>文本粗体：根据 HTML 5 的规范，b标签应该做为最后的选择，只有在没有其他标记比较合适时才使用它</b> <br>
            <bdi> 使其脱离其父元素的文本方向设置</bdi>
            <bdo dir="rtl">定义文本方向</bdo><br>
            <big> 定义比较大的文本 </big> (H5不再支持)<br>
            <small>定义小号文本</small>
            <blockquote>
                <p>定义块引用：blockquote元素中一般嵌套p元素，用于标记被引用的文本，这些引用文本并不是直接位于blockquote元素中<br>
                    通常浏览器会把blockquote元素呈现为一段左右两侧缩进(40px)的文本<br>
                    cite=URL 规定引用的来源。<br>
                </p>
            </blockquote>
            <center>文本居中对齐(H5不再支持)</center>
            <p>这个定义一个<cite>引用</cite>：一般用于作品（比如书籍、歌曲、电影、电视节目、绘画、雕塑等等）的标题</p>

            <del>被删除文本</del><br>
            <p>
                <em>呈现为被强调的文本。</em><br>
                <strong> 定义重要的文本。</strong><br>
                <dfn> 定义一个定义项目。</dfn><br>
                <code>	定义计算机代码文本。</code><br>
                <samp> 定义样本文本。</samp><br>
                <kbd> 定义键盘文本。它表示文本是从键盘上键入的。它经常用在与计算机相关的文档或手册中。</kbd><br>
                <var> 定义变量。您可以将此标签与 pre 及 code标签配合使用。</var><br>
            </p>
            <i>斜体</i><br>
            <ins>插入文本</ins><br>
            <mark>标记文本</mark>

            <p>展示给定的数据范围：</p>
            <meter value="2" min="0" max="10">2 到 10</meter><br>
            <meter value="0.6">60%</meter>
            <p><strong>注意：</strong> IE 浏览器不支持 meter 标签。</p>

            <pre>定义预留文本，             空格
                 换行
               </pre>
            <q>短引用符号</q><br>
            <ruby>
                注<rp>(</rp>
                <rt>zhu</rt>
                <rp>)</rp>
                音<rp>(</rp>
                <rt>yin</rt>
                <rp>)</rp>
            </ruby>
            <s>定义错误本文</s><br>
            <sup>上标文本</sup><sub>下标文本</sub><br>
            <time datetime="2019-09-23">定义时间</time><br>
            <u>下划线</u><br>
            <wbr>定义<wbr>合适位置换行
            <hr>

        </div>
        <div class="biaodan">
            表单：<br>
            <form>
                <fieldset>
                    <legend>表单</legend>
                    用户名：<input type="text"><br>
                    密&nbsp;&nbsp;&nbsp;&nbsp;码: <input type="password">
                    <keygen name="ked">加密
                    <br>

                    爱&nbsp;&nbsp;&nbsp;&nbsp;好：
                    <select>
                        <optgroup label="第一类">
                            <option>游戏</option>
                            <option>运动</option>
                            <option>旅游</option>
                        </optgroup>
                        <optgroup label="第二类">
                            <option>看电影</option>
                            <option>看书</option>
                            <option>看电视</option>
                        </optgroup>
                    </select><br>
                    所在城市：<input list="cary">
                    <datalist id="cary">

                        <option>成都</option>
                        <option>绵阳</option>
                        <option>德阳</option>

                        <option>南宁</option>
                        <option>桂林</option>
                        <option>柳州</option>

                    </datalist><br>
                    简&nbsp;&nbsp;介：<textarea cols="30" rows="10"></textarea><br>
                    <button>提交</button><button>重置</button>
                </fieldset>
            </form>
            <hr>
        </div>
        <div class="biaoge">
            <table border="1px" width="400px" >
                <tr >
                    <th>标题</th>
                    <th colspan="2">标题</th>
                </tr>
                <tr align="center">
                    <td>内容</td>
                    <td>内容</td>
                    <td>内容</td>
                </tr>
                <tr align="center">
                    <td>内容</td>
                    <td>内容</td>
                    <td>内容</td>
                </tr>
            </table>
        </div>
        <div class="styles">
            <canvas>图像标签通过脚本（通常是 JavaScript）来绘制图形（比如图表和其他图像）</canvas>
            <div>定义一个文档节，浏览器通常会在 div元素前后放置一个换行符</div>
            <span> span用于对文档中的行内元素进行组合
                   一种将文本的一部分或者文档的一部分独立出来的方式
            </span>
            
            <header>定义文档或者文档的一部分区域的页眉,应该作为介绍内容或者导航链接栏的容器<br>
                header 标签不能被放在 footer、address 或者另一个 header 元素内部
            </header>
            <footer>标签定义文档或者文档的一部分区域的页脚,在一个文档中，您可以定义多个 footer元素</footer>
            <section>标签定义了文档的某个区域。比如章节、头部、底部或者文档的其他区域,类似div</section>
            <article>标签定义独立的内容</article>
            <article>article独占一行</article>
            <aside>标签定义 article 标签外的内容</aside>
            <aside>内容应该与附近的内容相关,aside独自占一行</aside>

            <datalist>
                <summary>用户可见的或者隐藏的需求的补充细节，配合summary显示详细信息使用</summary>
                <p>详细信息</p>
                <p><b>注意:</b>目前，只有 Chrome 和 Safari 6 支持 details 标签</p>
            
            </datalist>
            <dialog>对话窗口 目前，只有 Chrome 和 Safari 6 支持 details 标签</dialog>
        </div>
    </div>