HTML标签 b 和 strong 的区别
<b>标签和<strong>标签都表示加粗,效果通常是一样的:
<b>:义演丁真<strong>:义演丁真
类似的还有<em>和<i>,都表示为斜体。
那么他们有什么区别呢?首先他们并不是在任何情况都一样。如果使用无障碍阅读器阅读网页,strong标签会被重读,而b标签不会。
更深一步来讲,他们的语义不同。b标签表示Bold,即字体加粗(我希望里面的内容用粗体显示),而strong标签表示“强调内容”(这里面内容要着重显示)。
在CSS不流行的年代,HTML本身需要来指定样式。所以b, i, small, sup这类标签就可以指定字体样式和大小,他们的语义就是“设置字体的形态大小(Bold Italic等)”;而strong, em这类标签语义上即为“重点(strong)和强调(emphasis)”,并不一定有什么特定的格式,只是通常strong用粗体,而em用斜体而已。所以他们的显示通常没有区别,意义却有区别:一个是“为了加粗而加粗”,一个是“因为强调而加粗”。
而在CSS流行的年代,加粗,大小等样式管理与HTML没啥关系了,b, i这样的字体样式标签逐渐少见,strong, em这类语义标签备受推崇。一方面,想要粗体斜体自己设置CSS就可以,避免了b的使用;另一方面,着重加强也并非必须要粗体斜体。使用strong可以方便的用CSS更改strong的其他样式。
现代HTML规范是这样描述这些标签的:
- <strong>:「strong importance for its contents」 着重的内容。
- <b>:「a span of text to which attention is being drawn for utilitarian purposes without conveying any extra importance and with no implication of an alternate voice or mood, such as key words in a document abstract, product names in a review, actionable words in interactive text-driven software, or an article lede」无强调意味的加粗
什么是无强调意味的呢?比如文章的作者,或者生物双名,再或者书名电影名,他们需要斜体粗体,用strong和em显然就不合语义。从这个角度来讲,markdown中的斜体一般都转换成em而非i,粗体都转化成strong而非b,好像不是一个很合理的选择(毕竟加粗不代表强调嘛)。
常见的字体样式标签:b, i, small, sup, sub, bdo。他们可以用CSS效果完全替代。
拓展阅读:HTML常见的文本语义标签
HTML标签 b 和 strong 的区别的更多相关文章
- HTML标签<b>与<strong>以及<i>与<em>的区别
在一般情况下,<b>和<strong>标签的显示效果一样,<i>和<em>标签的显示效果一样.那么它们的区别在哪呢?我们应该使用哪种标签呢? 在w3sc ...
- title与h1的区别、b与strong的区别、i与em的区别?
title与h1的区别 定义: title是网站标题, h1是文章主题 作用: title概括网站信息,可以直接告诉搜索引擎和用户这 个网站是关于什么主题和内容的,是显示在网页Tab栏里的: h1突出 ...
- 探究@property申明对象属性时copy与strong的区别
一.问题来源 一直没有搞清楚NSString.NSArray.NSDictionary--属性描述关键字copy和strong的区别,看别人的项目中属性定义有的用copy,有的用strong.自己在开 ...
- iOS中assign,copy,retain之间的区别以及weak和strong的区别
@property (nonatomic, assign) NSString *title; 什么是assign,copy,retain之间的区别? assign: 简单赋值,不更改索引计数(Refe ...
- assign,copy,retain的区别以及weak和strong的区别
@property (nonatomic, assign) NSString *title; 什么是assign,copy,retain之间的区别? assign: 简单赋值,不更改索 ...
- iOS开发——基础篇——assign,copy,retain之间的区别以及weak和strong的区别
@property (nonatomic, assign) NSString *title; 什么是assign,copy,retain之间的区别? assign: 简单赋值,不更改索引计数(Refe ...
- em和i , b和Strong 的区别
这两对标签最大区别就是一个给搜索引擎看的,一个是给用户看的. b标签和strong标签给我们的主观感受都是加粗,但对搜索引擎来说b标签和普通的文字并没有什么区别,而strong标签却是起强调作用的. ...
- htm 中 <b>和<strong>的区别
显示上两者没有任何区别,都是粗体<b>:为了加粗而加粗,推荐使用 css font-weight 属性来创建粗体文字.<strong>:为了强调而加粗,表示十分重要.在网页中使 ...
- script标签async和defer的区别及作用
作用: 1.没有 defer 或 async,浏览器会立即加载并执行指定的脚本,也就是说不等待后续载入的文档元素,读到就加载并执行. 2.async 属性表示异步执行引入的 JavaScript,与 ...
- html中<a>标签_top和_parent的区别
在html中,<a>标签有个target属性,而targe属性有四个值,分别是:_blank._self._top._parent.前两个相信很好理解,第一个就是在新窗口中打开的意思,第二 ...
随机推荐
- 国产软件如何让人再次失望——!20824 mindspore1.3.0gpu version can not compile from source code, because openmpi source code has bug
如题,该PR地址: https://gitee.com/mindspore/mindspore/pulls/20824#note_7053720 What type of PR is this? Un ...
- 关于python:pip安装选项“ ignore-installed”和“ force-reinstall”之间的区别
参考: https://www.codenong.com/51913361/ ==================================================== 官方文档解释: ...
- Ubuntu18.04动态桌面壁纸variety的安装
Ubuntu18.04桌面系统,安装动态更换桌面壁纸的应用,即安装软件 variety. variety 的安装: sudo apt install variety 安装好以后就会自动启动. 我们可以 ...
- vant 爬坑 (一)
vant 通过脚手架安装: # 安装 Vue Cli npm install -g @vue/cli # 创建一个项目 vue create hello-world # 创建完成后,可以通过命令打开图 ...
- 【共建开源】手把手教你贡献一个 SeaTunnel PR,超级详细教程!
Apache SeaTunnel是一个非常易于使用的.超高性能的分布式数据集成平台,支持海量数据的实时同步.每天可稳定高效同步数百亿数据,已被近百家企业投入生产使用. 现在的版本不支持通过jtds的方 ...
- Java栈溢出|内存泄漏|内存溢出
Java虚拟机栈是线程私有的,它的生命周期和线程同步 一个线程每执行到一个方法,JVM就会创建一个栈帧(用于存储基本数据类型.对象指针和返回值等),并将栈帧压入栈中. 代码示例: public cla ...
- CH05_数组
CH05_数组 概述 定义:一组相同类型的数据的集合. 描述: 1.数组中的每个元素都是相同的数据类型 2.数组是由连续的内存位置组成的. 3.数组索引是从0开始 一维数组 语法: 1.数据类型 数组 ...
- 前端使用 Konva 实现可视化设计器(21)- 绘制图形(椭圆)
本章开始补充一些基础的图形绘制,比如绘制:直线.曲线.圆/椭形.矩形.这一章主要分享一下本示例是如何开始绘制一个图形的,并以绘制圆/椭形为实现目标. 请大家动动小手,给我一个免费的 Star 吧~ 大 ...
- PowerShell 使用
Practice 常用命令 vim $PROFILE # 编辑配置文件 Get-ChildItem *> $null # 抛弃所有输出 whoami Remove-Item -Recurse - ...
- Dockerfile介绍及常用保留指令
从本文开始,咱们将介绍docker的另外一个技术点:dockerfile.我们来看看DockerFile相关的知识点,我们将怎么学习? 1:DockerFile是什么? 2:DockerFile构建过 ...