当前位置: 首页 > news >正文

HTML第二章 文本标签

2.文本标签

2.1 标题和段落标签

  • 标题标签(块级标签)
    • 格式:h1~h6

  • 段落标签(块级标签)
    • 格式:p

块级标签,在之前和之后都换行

<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metaname="viewport"content="width=device-width, initial-scale=1.0"><title>标题和段落标签</title></head><body><!-- 标题标签 h1~h6 表示不同级别的的标题 --><h1>h1 这是一个标题</h1><h2>h2 这是一个二级标题</h2><h3>h3 这是一个三级标题</h3><h4>h4 这是一个四级标题</h4><h5>h5 这是一个五级标题</h5><h6>h6 这是一个六级标题</h6><h7>h7 这是一个七级标题</h7><h8>h8 这是一个八级标题</h8><!-- 段落标签 p 表示段落 -->测试内容 这是一个段落 今天没安排繁重的计划,泡一杯温水,翻几页闲书,看着窗外云絮慢慢飘移。偶尔放空发呆,不用强迫自己时刻上进,允许自己短暂虚度光阴。人间本就庸常,那些微小的欢喜,才是支撑生活的温柔底气。<p>p 这是一个段落</p><p>p 今天没安排繁重的计划,泡一杯温水,翻几页闲书,看着窗外云絮慢慢飘移。偶尔放空发呆,不用强迫自己时刻上进,允许自己短暂虚度光阴。人间本就庸常,那些微小的欢喜,才是支撑生活的温柔底气。</p></body></html>

2.2 换行和水平线标签

  • 换行标签(行内标签)
    • 格式:<br>
  • 水平线标签(块级标签)
    • 格式:<hr>

换行标签<br>与 段落标签p的区别

  1. 段落标签
--》本行内容 空行 --》下一段内容 空行
  1. 换行标签
--》本行内容 --》下一段内容
<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metaname="viewport"content="width=device-width, initial-scale=1.0"><title>换行和水平线</title></head><body><!-- 换行标签 br 表示换行 -->用户名:张三 密码:123456<br>用户名:李五 密码:654321<p>这是一个段落</p>用户名:李四 密码:65456<!-- 水平线标签 hr 表示水平线 --><hr>这是第二个段落</body></html>

2.3 * 字体标签

仅作了解——后续字体样式使用 CSS实现

标签说明
font修饰字体,已弃用
b/strong加粗,b 渲染加粗,修饰文字样式,strong 强调文字内容(声明语义重要性)
i/em斜体,i 渲染斜体,修饰文字样式,em 强调文字内容
s/del加删除线,s 使用删除线渲染文本;当表示文本编辑时,del 表示一些从文档中删除的文字内容
q段文本标签,加双引号
u/ins渲染为实线下划线,可用 CSS 替换。ins 表示文档编辑时提倡使用,使用 a 标签时尽量不使用下划线
sup上标字体
sub下标字体
big/small大小号字体
pre保留文本中的空白字符(包括空格和换行符),保持原始格式,适用于展示代码或与格式文本

<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metaname="viewport"content="width=device-width, initial-scale=1.0"><title>字体标签</title></head><body>测试内容样例<hr><p><!-- font 表示字体 --><fontface="演示流云楷"size="3">这是一个段落</font></p><p><!-- b/strong 表示加粗字体 --><b>这是一个段落</b><strong>这是一个段落</strong></p><p><!-- i/em 表示斜体字体 --><i>这是一个段落</i><em>这是一个段落</em></p><p><!-- del/s 表示删除线字体 --><del>这是一个段落</del><s>这是一个段落</s></p><p><!-- q 表示引用字体 --><q>这是一个段落</q></p><p><!-- u/ins 表示下划线字体 --><u>这是一个段落</u><ins>这是一个段落</ins></p><p><!-- sub/sup 表示下标线字体 -->1<sub>这是一个段落</sub>2<sup>这是一个段落</sup></p><p><!-- big/small 表示大号字体和小号字体 --><big>这是一个段落</big><small>这是一个段落</small></p><p><!-- pre 表示预格式化字体 --><pre>静夜思 李白(唐) 床前明月光 疑是地上霜 举头望明月 低头思故乡</pre></p></body></html>

  • 特殊字符
    • 格式:&
    • 常见总结如下:
标签符号说明
&nbsp;空格符
&copy;©©版权
&lt;<<小于号
&gt;>>大于号
&yen;¥¥人民币
&quot;""引号
&reg;®®商标
&plusmn;±±加减
&permil;‰千分号
&divide;÷÷除号
http://www.jsqmd.com/news/1358433/

相关文章:

  • AGENTS.md:AI编程时代的项目元数据契约与协作规范指南
  • OpenAI 密钥轮换漏测的 4 小时:我的日志系统把生产凭据发给了第三方
  • 浏览器调试器高效使用技巧
  • [AGM 2022 资格赛] 分裂 题解
  • 2026年螺杆泵选购不踩坑指南:全维度对比适配各需求品牌清单 - 上海泵阀科技网
  • 从零构建AI Agent:基于LangGraph的多智能体系统实战与面试指南
  • word压缩大小怎么弄?7款PDF与文档压缩工具实测盘点
  • Unity游戏开发配置管理革命:Luban Next自动化部署与集成实战指南
  • xLua热更新下Unity网格渲染性能优化实战:五大技巧解决卡顿与高DrawCall
  • 小红书视频下载方法与保存无水印视频的完整实践手册,摸清**规则与第三方下载工具风险 - 免费软件工具方法教程
  • 2026年8月苹果合肥品牌授权售后查询与进液后处理与资料保护|散热负载检查|电话接收确认 - 数码产品售后
  • AI数字供应链安全治理:技术架构与行业实践
  • Java后端实战进阶:从JVM调优到微服务与AI落地的全栈能力构建
  • Docker部署OpenClaw汉化版:从环境隔离到一键启动的完整实践
  • 2026年气动隔膜泵厂家推荐 高口碑品牌选购全指南 - 上海泵阀科技网
  • AI 办公 Agent 扎堆上线,个人开发者如何管理碎片化线上工具
  • Zotero Citation:让学术写作中的引用管理变得轻松高效
  • League Akari:英雄联盟玩家的智能助手,5大功能提升游戏体验
  • 企业级RAG问答系统实战:从文档处理到智能检索的完整构建指南
  • 国产CPU五强横评:鲲鹏/海光/飞腾/兆芯/龙芯
  • Baklib在RubyConf China 2025拆解企业内容管理三大痛点与落地案例
  • 告别版本混乱:基于Git Flow与CI/CD的自动化发布规范实践
  • 终极帧率解锁指南:如何让原神和星穹铁道突破60帧限制
  • CAP定理在大数据系统中的实践与权衡
  • Origin高效科研绘图:从零构建个性化工作流与模板配置
  • 2026年8月南昌机械革命电脑售后电话与门店地址|不开机、进水与屏幕故障处理说明|红谷滩区等区域预约维修核对 - 笔记本售后大全
  • Python+Vue无纸化办公系统开发实战
  • 终极围棋AI分析指南:用LizzieYzy从入门到精通的完整教程
  • MCP百万token窗口首周账单:我的预算表竟漏算了这3类隐性成本
  • UE5配置系统深度解析:从C++默认值到DeviceProfile的优先级链