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

HTML_文本标签

概念:
1、用于包裹:词汇、短语等。
2、通常写在排版标签里面。
3、排版标签更宏观(大段的文字),文本标签更微观(词汇、短语)。
4、文本标签通常都是行内元素。

常用的文本标签
标签名 全称  标签语义
em Emphasized      加重(文本)。要着重阅读的内容
strongstrong  十分重要的内容(朗读时语气比em要强)
span span   

范围。没有具体语义,用于包裹短语的通用容器

brBreak Row换行
hrHorizontal Rule分割线
prePreformatted

预定义格式(文本)、按原文显示(一般用于在页面中嵌入大量代码,火星文等)

不常用的文本标签
标签名 全称  标签语义
cite Citation      引用。通常包含作品标题(书籍、歌曲、电影、电视节目、绘画、雕塑)。
dfn                                                    definition定义。通常是特殊术语,或专属名词等。
del与ins            delete与insert删除的文本 与 插入的文本。
sub与supSubscripted与Superscripted 下标 与 上标。
code code 一段代码 
samp  sample  从正常的上下文中,将某些内容提取出来。例如:标识设备输出。
kbdKeyboard 键盘文本,表示文本是通过键盘输入的,经常用在计算机相关的手册中。
abbr Abbreviation缩写词(通常配合上title属性)。
bdo   Bi-Directional Override文本显示方向(通常要配合dir属性),可选值:默认值是ltr(left to right)、rtl(right to left)。
varVariable 变量(文本),可以与code标签一起使用。
smallSmall变小(文本),附属细则,例如:包括版权、法律文本。
bBold摘要中的关键字、评论中的产品名称。
iItalic斜体(文本),通常用来表示科技术语、其他语种的成语俗语、想法、宇宙飞船的名字等等。现在多用于:呈现字体图标。
uUnderlined下划线(文本),通常表示与正常的内容有反差的文本。例如:错的单词、不合适的描述等。
qQuotation引用语、短引用。
blockquote(块元素)Block Quotation 区块引用语、长引用。
address(块元素)address地址

备注:
1、这些不常用的文本标签。编码时不用过于纠结(酌情而定,不用也没毛病)。
2、blockquote与address是块级元素,其他的文本标签都是行内元素。
3、有些语义感不强的标签,我们很少使用,例如:small、b、u、q、blockquote。
4、HTML标签太多了!记者那些重要的、语义感强的标签即可,截止目前,有这些:
h1~h6、p、div、em、strong、span。

举例:

<body>
    <span>举例:</span>
    <p>
        1、这首 <cite>《光辉岁月》</cite>,非常的好听!<br>
        2、<dfn>耗子尾汁</dfn>,是一个网络流行语,意思为 <dfn>好自为之</dfn>。<br>
        3、商品原价:<del>199</del>,限时秒杀:<ins>99</ins> 。<br>
        4、水的化学方程式是:H<sub>2</sub>O,8的三次方是这么写的:8<sup>3</sup>。<br>
        5、等过一段我们学习了JS,你就会发现这段代码很有意思:<code>alert(1)</code>。<br>
        6、手机突然提示: <samp>支付宝到账100万元!</samp><br>
        7、保存的快捷键是: <kbd>ctrl + s</kbd>。<br>
        <!-- 移入到LOL时会显示全称名:英雄联盟 -->
        8、 <abbr title="英雄联盟">LOL</abbr>这个游戏非常好玩!<br>
        9、你是年少的欢喜,这句话反过来念就是: <bdo dir="rtl">你是年少的欢喜</bdo>。<br>
        10、等过一段我们学习了JS,我们就知道要这样定义变量: <code>let <var>a</var> = 1</code>。<br>
        11、<small>本网站所有资料、图表仅供参考,涉及投资项目所造成的赢亏与本网站无关。</small> <br>
        12、我也买个<b>罗技GPW二代</b>这个鼠标,确实很好用!<br>
        13、猪头声嘶力竭的喊着:<i>“ 燕子,没有你我怎么活啊!”</i><br>
        14、张三把“你好”的英文写成了:<u>heelo</u>,这是不对的!<br>
        15、屈原曾经说过:<q>路漫漫其修远兮,吾将上下而求索</q><br>
        16、有一首歌,歌词是这样的: 
        <blockquote>后来,我总算学会了如何去爱,可惜你早已远去消失在人海;后来,终于在眼泪中明白,有些人一旦错过就不在。</blockquote>
        17、我们学校地址是:<address>江西省南昌市八一公园</address>
    </p>
</body>


http://www.kler.cn/a/355280.html

相关文章:

  • 【前端】MVC模式详解:如何构建高效的Web应用程序?
  • 百度千帆平台构建AI APP的基础概念梳理
  • 论文阅读 - 《Large Language Models Are Zero-Shot Time Series Forecasters》
  • 【QED】爱丽丝与混沌的无尽海
  • 深度学习中batch_size
  • 学习threejs,THREE.CircleGeometry 二维平面圆形几何体
  • MySQL【知识改变命运】05
  • 计数型信号量
  • 【C语言】函数指针
  • 什么是ERP?快速理解ERP系统与ERP软件的区别
  • Python 数值计算与数值分析基础
  • 拿到snp的rawdata后如何使用GATK进行筛选(GATK硬筛选文档翻译)
  • 基于BERT的语义分析实现(论文复现)
  • 51单片机的超声波视力保护仪【proteus仿真+程序+报告+原理图+演示视频】
  • PCL 点云配准-4PCS算法(粗配准)
  • Tbox编译注意问题
  • java基于SpringBoot+Vue+uniapp微信小程序的自助点餐系统的详细设计和实现(源码+lw+部署文档+讲解等)
  • 基于Springboot+Vue的宠物援助平台(含源码+数据库)
  • 【编程语言】Kotlin快速入门 - 集合与Lambda
  • 删除 Word 空白页的 3 种方法总结
  • 中标麒麟v5安装qt512.12开发软件
  • Python进阶知识2
  • 2024第七届全国大学生数学竞赛暨数学精英挑战赛第二场,第一场获奖名单已公布
  • 重生之我爱上了k8s!
  • 【论文分享】ShEF: Shielded Enclaves for Cloud FPGAs 22‘ASPLOS
  • [Windows]文件搜索利器Everything(附zip)