已弃用的代码: vs style="font-weight:bold;"

2024-05-04

我一直用<b>标记为粗体,因为这是我很久以前就被教做的方式。但现在我的 IDE 总是告诉我<b>已弃用并使用 css 样式。假设他们希望我使用<div style="font-weight:bold;">Bold Text</div>。我的 IDE 给我的这条消息有多重要?我是否应该回去改变我的一切<b>风格?

下面是这两种情况的示例。有人可以解释两者之间的差异以及原因吗<b>现在已弃用吗?

<b>Bold Text</b>

Vs.

<div style="font-weight:bold;">Bold Text</div>

Would <b>更好,因为如果有人在浏览器上关闭了 css,它仍然会正确显示?


正确的问题是:“什么标记最能描述我的内容?”

让我们从<b>标签(即not已弃用):

b 元素表示要在风格上偏移的文本范围 来自普通散文,没有传达任何额外的重要性,例如 文档摘要中的关键词、评论中的产品名称或其他 其典型排版呈现方式为粗体的文本跨度。

...

如果有更具描述性和意义的内容,则不应使用 b 和 i 标签 相关标签可用。如果您确实使用它们,通常最好 添加描述标记的预期含义的类属性, 以便您可以区分一种用途和另一种用途。

...

将 b 或 i 元素视为本质上的 span 元素可能会有所帮助 具有自动后备样式。就像 span 元素一样,这些 如果元素有用的话,通常会受益于类名。

http://www.w3.org/International/questions/qa-b-and-i-tags http://www.w3.org/International/questions/qa-b-and-i-tags

通过对比,<strong>有一个更具体的目的:

强元素代表一段具有很强重要性的文本。

http://www.w3.org/TR/html-markup/strong.html http://www.w3.org/TR/html-markup/strong.html

例如:

<p><strong>Warning.</strong> Here be dragons.</p>

Here we emphasize the word "warning" to stress its importance.

But not:

<p><strong>Item 1:</strong> Foo, bar, and baz.</p>

"Item 1" isn't meant to be stressed, so <strong> is the wrong tag. Furthermore, it's possible that the whole structure could be better represented.

如果文本的含义非常重要,<strong>是合适的(就像这一行一样)。

也许您只是出于样式目的想要使用较粗的字体,并且文本没有特殊含义。在这种情况下,既不<strong> nor <b>可能是合适的。

<span class="product-name">Hello World</span>

.product-name { font-weight: bold; }

在所有情况下:

  • 使用描述内容的标记。
  • 不要使用内联样式(使用外部样式表)。
  • 不要根据样式的视觉表现来命名样式(例如,将样式命名为“粗体”是一个糟糕的选择)

Would <b>更好,因为如果有人关闭了 css 浏览器,它仍然可以正确显示吗?

不。请为作业使用正确的标记。对于使用站点的视觉表示形式的人来说,自愿禁用样式表是相当不寻常的,但非视觉消费者主要关心文档的结构。 “非视觉消费者”可以是解析您的内容的搜索引擎或屏幕阅读器应用程序。

补充阅读:

  • http://www.w3.org/TR/html51/text-level-semantics.html#the-strong-element http://www.w3.org/TR/html51/text-level-semantics.html#the-strong-element
  • http://www.w3.org/TR/html51/text-level-semantics.html#the-b-element http://www.w3.org/TR/html51/text-level-semantics.html#the-b-element
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

已弃用的代码: vs style="font-weight:bold;" 的相关文章

  • 将html表格保存到excel中[关闭]

    很难说出这里问的是什么 这个问题是含糊的 模糊的 不完整的 过于宽泛的或修辞性的 无法以目前的形式得到合理的回答 如需帮助澄清此问题以便重新打开 访问帮助中心 help reopen questions 我必须编写一个程序 定期读取网页并将
  • JavaScript 中带前导零的数字发生变化

    我使用 print 语句从 php 调用 javascript 函数来打印 html 代码 并且传入一个整数 但是 在 php 中传递的值与 javascript 函数接收到的数字不匹配 我不知道为什么 这是调用 javascript 函数
  • Internet Explorer 中的锯齿状按钮边缘

    如何去除 Internet Explorer 中宽按钮的锯齿状边缘 例如 您还可以通过设置来消除 Windows XP 的按钮样式 以及 Windows 的所有其他版本 background color and or border colo
  • Java Web 技术中的 AJAX 自动完成文本框(JSP 和 servlet)

    我需要您的帮助 了解如何使用 Java Web 技术 JSP Servlet 和 AJAX 使 HTML 输入文本元素像 Google 的 AJAX 搜索引擎 输入文本元素一样工作 下拉列表中的数据将来自数据库表 例如分别是 MySQL 或
  • 我应该使用哪种文档类型?

    如果我想使用可定制的 div 我应该使用哪种文档类型 具有div动画 图像移动 设置div不透明度等 我尝试通过 javascript 创建一个 div 设置其背景颜色 位置 宽度和高度 并向其添加 onmouseover 事件 一切正常
  • 通过 jQuery 选择动态 HTML 元素

    我正在构建一个 ASP NET MVC 应用程序 并且正在使用jQuery Blueimp https github com blueimp jQuery File Upload动态添加到页面的 PartialView 上的插件 根据插件的
  • * 到底有多慢?

    大家都表示 选择器非常慢 但它到底有多慢呢 我总是试图避免它 但有时它非常有用 例如 h1 margin top 1em 简单来说 通用选择器 速度只与页面上的元素一样慢 Since 从右到左匹配浏览器获取每个元素并将其与所有候选规则进行匹
  • 为什么我的反应路由器链接将我带到页面中间?

    我的网站上有很多链接 但只有一个可以执行此操作 它没有将我带到导航栏的顶部 而是转到内容的中间 知道为什么会这样吗 这是一个页面 其中有一个 map经历一些JSON 这是渲染div页面下方的文本元素 如果重要的话 这是一些可能相关的代码 路
  • Angular UI select:从远程服务获取数据

    我正在使用角度用户界面选择 https github com angular ui ui select https github com angular ui ui select 我查看了演示的可用位置这个笨蛋 http plnkr co
  • 我怎样才能让这个脚本在 WordPress 上运行?

    我有这个脚本 document ready function text1 click function this hide 代码html div class div1 p class text1 text to appear when th
  • 设置双指缩放时精确的滚动位置

    我正在创建一个地图应用程序 它将标记图像放置在画布上并滚动到它 我正在使用浏览器的捏缩放和滚动来放大 缩小地图 然而 我注意到有一些奇怪的行为 我想知道如何解决它 这有点难以解释 但我们开始吧 假设您处于网页的标准缩放级别 无法进一步缩小
  • 嵌套计算操作

    希望这很简单 我想使用CSS calc操作来执行两个计算 我想将宽度设置为等于 100 7 2 但是 如果我尝试在 CSS 计算操作中执行多个操作 则会失败 width calc 100 7 2 如何在一个 CSS 语句中执行多个计算操作
  • CSS 显示无不工作

    media screen and min width 900px and max width 1215px menu display none 这不起作用 div 仍然可见 但是 如果我将 div 更改为 div class menu 代替
  • 使用 CSS 网格布局使网格项内的元素高度相等

    我在长度超过 4 的 div 中有一系列文章 没有任何舍入行标签 我需要将其表示为每行 3 篇文章 列 的表格 可能包含display grid 每篇文章都有页眉 章节和页脚 如何在每行文章内实现每个标题的等高 每个部分的等高以及与文章底部
  • 内嵌显示定义术语和描述

    我正在为页面上的某些元素使用定义列表 并需要它们内联显示 例如 它们normally看起来像 我需要它们看起来像 注意多个 DD 我可以让它们在 moz 中使用 float 来正常工作 但无论我尝试什么 它们都无法在 IE 中工作 我通常会
  • 如何将 Vue.js 作用域样式应用于通过视图路由器加载的组件?

    如何将 Vue js 作用域样式应用于通过以下方式加载的组件
  • 如何删除标题中的粗体?

    我有一个标题 h1 THIS IS A HEADLINE h1 如何使短语 THIS IS 不加粗 其余部分不做任何更改 我在文本装饰中找不到任何相关标签 标题看起来很粗体 因为它大尺寸 如果您已应用粗体或想要更改行为 您可以执行以下操作
  • Service Worker 与 Shared Worker

    Service Worker 和 Shared Worker 有什么区别 我什么时候应该使用 Service Worker 而不是 Shared Worker 反之亦然 Service Worker 具有共享 Worker 之外的附加功能
  • 我可以使用 ASP.NET WebForms 母版页在每个内容页中包含不同的 javascript/css 文件吗?

    我有几个使用相同母版页的内容页 它们并不都需要包含在相同的 javascript 和 css 文件中 tag 是否可以更改内容来自内容页面的标签 确实如此 但我建议采取一些不同的做法 我在关闭正文标签的正上方放置了一个内容占位符 然后我填充
  • 如何在数据列表 HTML PHP 中设置选择

    您好我想知道是否有一种方法可以在数据列表中设置选定的值 我想要这样的东西

随机推荐

Powered by Hwhale