最近在学习HTML基本知识,看到b标签和strong还有em,都是表示强调目的的,那他们之间的区别是什么呢?总结如下:

  1. < b > < i > 是视觉要素(presentationl elements),分别表示无意义的加粗,无意义的斜体,表现样式为 { font-weight: bolder },仅仅表示「这里应该用粗体显示」或者「这里应该用斜体显示」,此两个标签在HTML4.01中并不被推荐使用;
  2. < em > 和 < strong > 是表达要素(phrase elements)。 < em > (emphasized text)表示一般的强调文本,而 < strong > (strong emphasized text)表示比 < em > 语义更强的的强调文本。
  3. 在新的html5中,<em> 和 <strong> 仍旧是表达要素(phrase elements)。但这时的 < strong > 表示html页面上的强调(emphasized text), < em > 表示句子中的强调(即强调语义)。
    i 元素现在描述为在普通文章中突出不同意见或语气或其他的一段文本,例如:一个分类名称,一个技术术语,一个外语中的谚语,一个想法等。或者代表斜体的排版方式

    b 元素现在描述为在普通文章中仅从文体上突出的不包含任何额外的重要性的一段文本。例如:文档概要中的关键字,评论中的产品名。或者代表强调的排版方式。

  参考内容如下:

  1. stackoverflow:

    They have the same effect on normal web browser rendering engines, but there is afundamental difference between them.

    在大多数浏览器的渲染引擎上都是一个效果,但是两者的基础不同

    As the author writes in a discussion list post:

    Think of three different situations:

    有三个不同的应用场景:浏览器、盲人、移动电话

    • web browsers
    • blind people
    • mobile phones

    "Bold" is a style - when you say "bold a word", people basically know that it means to add more, let's say "ink" around the letters until they stand out more amongst the rest of the letters.

    BOLD 是一种样式,当人们说“加粗一个单词”时,大家会认为增加一些(比如叫墨水)到这些词上以便让这些词看起来比旁边的词更显眼

    That, unfortunately, means nothing to a blind person. And on mobile phones and other PDAs, text is already bold because screen resolution is very small. You can't bold a bold without screwing something up.

    但是,不幸的是,这对盲人来说毫无作用。而且对手机或者其他的手持设备来说,由于其屏幕的分辨率很小,文本已经被加过粗了,我们也无法再加粗一个已经加粗的了。

    <b> is a style - we know what "bold" is supposed to look like.

    <b> 标签是一种style,我们都知道“加粗”应该长什么样。

    <strong> however is an indication of how something should be understood. "Strong" could (and often does) mean "bold" in a browser, but it could also mean a lower tone for a speaking program like Jaws (for blind people). And strong on a Palm Pilot may be an underline (since you can't bold a bold).

    <strong>标签一种对有些事情需要被理解的暗示。“strong” 在浏览器应该(也一般会)意味着bold,但是(对于盲人来说),它就可以被像Jaws一样的语音程序理解成一种强调音。strong在手持设备上可能会是一个下划线(因为你不能在加粗了)。

    HTML was never meant to be about styles. Do some searches for "Tim Berners-Lee" and "the semantic web". <strong> is semantic - it describes the text it surrounds ("this text should be stronger than the rest of the text you've displayed") as opposed to describing how the text it surrounds should be displayed ("this text should be bold").
    HTML从来都不是只意味着样式。去搜一下tim berners-lee 和语义web。<strong>标签就是一种语义,它描述的场景是它所包含的内容应该比你显示的其他文本更strong,而不是它所包含的文本应该其他的加粗。

  2. http://www.zhihu.com/question/19551271

HTML中em与b等的区别的更多相关文章

  1. CSS中px和em属性的特点与区别

    详解px和em的特点和区别象素px是我们在定义CSS中经常用到的尺寸大小单位,而em在国外网站中经常被使用,px和em之间究竟有什么区别和特点呢?◆px像素(Pixel),相对长度单位.像素px是相对 ...

  2. CSS中em,px区别(转)

    这里向大家描述一下CSS中px和em的特点和区别,px像素(Pixel),相对长度单位,像素px是相对于显示器屏幕分辨率而言的,而em是相对长度单位,相对于当前对象内文本的字体尺寸,相信本文介绍一定会 ...

  3. css中字体常用单位px、em、rem和%的区别及用法总结

    一.px.em.rem和%的定义 1.px(像素) px单位的名称为像素,它是一个固定大小的单元,像素的计算是针对(电脑/手机)屏幕的,一个像素(1px)就是(电脑/手机)屏幕上的一个点,即屏幕分辨率 ...

  4. em与rem之间的区别以及移动设备中的rem适配方案

    em与rem之间的区别: 共同点: 它们都是像素单位 它们都是相对单位 不同点: em大小是基于父元素的字体大小 rem大小是基于根元素(html)的字体的大小 实例: <!DOCTYPE ht ...

  5. C#中??和?分别是什么意思? 在ASP.NET开发中一些单词的标准缩写 C#SESSION丢失问题的解决办法 在C#中INTERFACE与ABSTRACT CLASS的区别 SQL命令语句小技巧 JQUERY判断CHECKBOX是否选中三种方法 JS中!=、==、!==、===的用法和区别 在对象比较中,对象相等和对象一致分别指的是什么?

    C#中??和?分别是什么意思? 在C#中??和?分别是什么意思? 1. 可空类型修饰符(?):引用类型可以使用空引用表示一个不存在的值,而值类型通常不能表示为空.例如:string str=null; ...

  6. css中em小于1时chrome字体大小和firefox字体大小不一致的问题

    css中em设置为0.8,结果页面显示,chrome字体比firefox字体大了不少. chrome有默认字体大小,默认为12px.设置的字体大小小于12px时,也是按照12px来显示. firefo ...

  7. JDBC中的Statement和PreparedStatement的区别

    JDBC中的Statement和PreparedStatement的区别  

  8. LINQ语句中的.AsEnumerable() 和 .AsQueryable()的区别

    LINQ语句中的.AsEnumerable() 和 .AsQueryable()的区别 在写LINQ语句的时候,往往会看到.AsEnumerable() 和 .AsQueryable() .例如: s ...

  9. JavaScript中const、var和let区别浅析

    在JavaScript中有三种声明变量的方式:var.let.const.下文给大家介绍js中三种定义变量的方式const, var, let的区别. 1.const定义的变量不可以修改,而且必须初始 ...

随机推荐

  1. 动作手游实时PVP帧同步方案(客户端)

    1.概述 1.1.基于UDP的帧同步方案 在技术选型方面,之所以选择帧同步方案,在Kevin的一篇介绍PVP帧同步后台实现的文章中已经做了详细叙述,这里简单摘要如下: 高一致性.如果每一帧的输入都同步 ...

  2. Android 腾讯入门教程( 智能手表UI设计 和 MVC模式 )

    *****注意到mvc 在android 中是如何进行分层分域执行各自的功能.**** 官方推荐的按钮尺寸是48像素 前端之Android入门(1):环境配置 前端之Android入门(2):程序目录 ...

  3. Data对象

    var myDate = new Date(); Date()返回当日的日期 例如今天是2016/8/19 getFullYear()返回当前日期的年 myDate.getFullYear() 201 ...

  4. sublime 安装 插件

    从菜单 View - Show Console 或者 ctrl + ~ 快捷键,调出 console.将以下 Python 代码粘贴进去并 enter 执行,不出意外即完成安装.以下提供 ST3 和 ...

  5. winform控件在Enable=false的情况下改变它的字体颜色

    [System.Runtime.InteropServices.DllImport("user32.dll ")]         public static extern int ...

  6. Python 爬虫2——环境配置

    关于环境配置的操作,其实非常简单,假如不使用第三方的框架的话,只需要安装Python即可完成后续的操作. 一.Python的安装和配置: windows系统的安装配置过程如下,假如是Mac系统,可参考 ...

  7. ajax的理解与工作流程

    一.什么是ajax ajax是一种异步通信技术.在ajax出现之前,客户端与服务端之间直接通信.引入ajax之后,客户端与服务端加了一个第三者--ajax.有了ajax之后,通过在后台与服务器进行少量 ...

  8. hibernate不同版本获取获取sessionFactory

    hibernate4时,我们采用以下方式获取会话工厂: // 1. 解析我们在hibernate.cfg.xml中的配置 Configuration configuration = new Confi ...

  9. MAC显示文件夹路径

    MAC显示文件夹路径 终端命令 1.显示路径:defaults write com.apple.finder _FXShowPosixPathInTitle -bool TRUE;killall Fi ...

  10. 05.DOM

    DOM基础 什么是DOM 标签元素节点浏览器支持情况  火狐支持最好 谷歌其次 ie最差 尤其是ie6-8DOM节点节点分为:元素节点和文本节点 测试节点的类型用nodeTypenodeType 为3 ...