当前位置：首页 > 行业动态 > 正文

html纯文字标签

HTML纯文字标签如` 保留格式， 标记代码，`（已弃用）显示文本，常用于无需样式的纯内容展示

基础文本标签

功能描述 示例代码
<p> 定义段落，自动添加上下间距 <p>这是一个段落。</p>
<br> 强制换行，不产生新段落 这段文字<br>需要换行
<hr> 水平分割线，视觉上分隔内容 <hr>
<pre> 预格式化文本，保留空格和换行符 <pre> 缩进 换行</pre>

文本语义化标签

语义功能 示例代码
<strong> 强调重要内容（语义化，搜索引擎更重视） <strong>关键内容</strong>
<em> 强调语气（如斜体表示强调） <em>注意</em>
<code> 表示代码或程序片段 <code>console.log("Hello");</code>
<small> 小号字体，通常用于免责声明或次要信息 ©2023 <small>版权所有</small>

装饰性标签（建议用CSS替代）

功能描述 替代方案（CSS）
<b> 粗体显示（无语义） <span style="font-weight:bold">
<i> 斜体显示（无语义） <span style="font-style:italic">
<u> 下划线（已废弃，避免使用） <span style="text-decoration:underline">
<font> 设置字体大小/颜色（HTML5已弃用） 使用CSS font-size/color属性

HTML5新增语义标签

适用场景 示例代码
<article> 块（如文章、博客） <article>一篇报道</article>
<section> 文档中的章节（需有标题） <section><h2>标题</h2>内容</section>
<mark> 高亮标记文本 <mark>重要关键词</mark>

常见问题与解答

问题1：<div>和<span>有什么区别？

解答：

html纯文字标签 第1张

  • <div>是块级元素，独占一行，用于分组大块内容。
  • <span>是行内元素，不会打断文本流，用于包裹局部文本。
    示例： 

    <div>这是一个块</div> <!-前后有换行 -->
<span>这是行内文本</span> <!-与其他文本在同一行 -->

问题2：为什么推荐用<strong>而不是<b>？

解答：

  • <strong>具有语义化意义，表示内容重要性，利于SEO和屏幕阅读器识别。
  • <b>仅表示粗体样式，无额外语义，建议通过CSS实现视觉效果。
    推荐写法： 

    <strong>重要内容</strong> <!-语义+样式 -->
<span style="font-weight:bold">重要内容</span> <!-仅样式 -->
纯文本
0

相关文章