1. 文本标签演示

这是h1标题（最大）

这是h2标题

这是h3标题

这是h4标题

这是h5标题

这是h6标题（最小）

这是一个段落标签，会自动在前后添加间距。

这是第二个段落，
使用br标签实现强制换行效果。

粗体文本（b标签）

强调粗体文本（strong标签）

斜体文本（i标签）

强调斜体文本（em标签）

小号文本（small标签）

插入文本（ins标签，带下划线）

~~删除文本（del标签，带删除线）~~

2. 多媒体标签演示

图片标签示例

图片标签：<img src="https://picsum.photos/800/400" alt="示例图片" width="800" height="400" title="随机示例图片">

音频标签示例

音频标签：<audio controls><source src="音频URL" type="audio/mpeg"></audio>

视频标签示例

视频标签：<video controls width="800" poster="封面图URL"><source src="视频URL" type="video/mp4"></video>

3. 链接标签演示

不同类型链接

链接属性说明

属性	值	说明
href	URL/锚点/邮件/电话	链接目标地址
target	_blank/_self/_parent/_top	打开方式
title	文本	鼠标悬停提示
download	文件名	下载文件名称

锚点目标区域

这是锚点链接跳转到的目标位置，使用id属性定义锚点名称。

锚点定义：<div id="section1">...</div>

锚点链接：<a href="#section1">跳转到该区域</a>

4. 综合示例：个人简介卡片

<div class="profile-card">
    <div style="text-align: center;">
        <img src="头像URL" alt="个人头像" style="border-radius:50%; width:150px;">
        <h2>张三</h2>
        <p>计算机网络应用专业</p>
    </div>
    <div style="display: flex; gap:20px;">
        <div>
            <h3>基本信息</h3>
            <p><strong>年龄：</strong>20岁</p>
            <p><strong>技能：</strong>HTML、CSS、Python</p>
        </div>
        <div>
            <h3>联系方式</h3>
            <p><a href="tel:13800138000">13800138000</a></p>
            <p><a href="mailto:zhangsan@example.com">zhangsan@example.com</a></p>
        </div>
    </div>
</div>