HTML常见标签用法 WEB

最新推荐文章于 2024-09-14 22:18:26 发布

赛文f

最新推荐文章于 2024-09-14 22:18:26 发布

阅读量665

点赞数 10

文章标签：前端 html javascript

本文链接：https://blog.csdn.net/lsp54188/article/details/136160460

版权

本文详细介绍了HTML的各种基础标签，包括文本内容的段落、链接、强调和容器，列表（无序和有序），表格结构，表单元素，多媒体元素如图片、音频和视频，以及其他如框架、容器和页面结构部分。

摘要由CSDN通过智能技术生成

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>HTML标签用法表</title>
</head>
<body>
    <h1>HTML标签用法表</h1>

    <h2>文本内容</h2>
    <p>段落标签：用于定义段落。</p>
    <a href="https://www.example.com">链接标签</a>
    <strong>强调标签</strong>
    <em>斜体标签</em>
    <span>文本容器标签</span>
    <br>换行标签

    <h2>列表</h2>
    <ul>
        <li>无序列表
            <ul>
                <li>嵌套列表项</li>
            </ul>
        </li>
    </ul>
    <ol>
        <li>有序列表</li>
    </ol>
    <dl>
        <dt>定义列表</dt>
        <dd>定义描述</dd>
    </dl>

    <h2>表格</h2>
    <table border="1">
        <tr>
            <th>表头单元格</th>
            <th>表头单元格</th>
        </tr>
        <tr>
            <td>数据单元格</td>
            <td>数据单元格</td>
        </tr>
    </table>

    <h2>表单</h2>
    <form>
        <input type="text" placeholder="文本输入">
        <input type="password" placeholder="密码输入">
        <input type="checkbox" id="checkbox"> <label for="checkbox">复选框</label>
        <input type="radio" id="radio"> <label for="radio">单选框</label>
        <textarea placeholder="文本域"></textarea>
        <button>按钮</button>
        <select>
            <option>选项</option>
        </select>
        <label for="file">文件上传</label>
        <input type="file" id="file">
    </form>

    <h2>多媒体</h2>
    <img src="image.jpg" alt="图片描述">
    <audio controls>
        <source src="audio.mp3" type="audio/mp3">
    </audio>
    <video controls width="320" height="240">
        <source src="movie.mp4" type="video/mp4">
    </video>

    <h2>其他</h2>
    <iframe src="https://www.example.com"></iframe>
    <div>分割容器</div>
    <header>页眉</header>
    <footer>页脚</footer>
    <nav>导航链接</nav>
    <article>文章内容</article>
    <section>文章分节</section>
    <aside>侧边栏</aside>
    <figure>
        <img src="image.jpg" alt="图片描述">
        <figcaption>图片描述</figcaption>
    </figure>
</body>
</html>