加入收藏 | 设为首页 | 会员中心 | 我要投稿 湖南网 (https://www.hunanwang.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 编程 > 正文

标志说话——短语元素

发布时间:2020-03-16 18:29:20 所属栏目:编程 来源:站长网
导读:点击这里返回剧本之家 HTML教程 栏目. 上文:标志说话表单 原文出处Chapter 6 strong,em与其他短语元素 在弁言和前面的章节中,已经轻微提到过语义标签的观念,行使标签为文件标识意义,而不是纯真的以标签设定表现结果.计划完全行使语义标签的网页是个不错的
点击这里返回剧本之家 HTML教程 栏目.
上文:标志说话——表单
原文出处 Chapter 6 <strong>,<em>与其他短语元素
在弁言和前面的章节中,已经轻微提到过语义标签的观念,行使标签为文件标识意义,而不是纯真的以标签设定表现结果.计划完全行使语义标签的网页是个不错的点子.然而我认为这个方针太抱负化了.虽然,没有完全到达方针并不代表全力进程毫无代价.至少朝着这个方针全力很有代价.
在实际环境下,常常有须要加上非语义标签,以便实现特定的计划方针,首要是由于此刻闻名的赏识器都无法百分之百支持尺度的缘故.有些CSS法则在部门赏识器中无法表现正确的结果,而这不幸的让我们在告竣某些计划方针的进程中必需行使特另外标签.
有个重要的观念必需放在心上:那就是只管实行撰写语义化布局将能带来现实的甜头.同时,对尺度的支持固然没有到达百分之百,但也已经越过临界点让我们此刻就能行使切合收集尺度的要领撰写网页.有些时辰必需做点捐躯,可是僵持撰写越多的切合尺度的标签,将来的事变就会越轻松. 表现结果 VS 布局标签
本章节将会接头表现结果与布局标签的差异,更确切的说,是接头行使<strong>替代<b>,以及行使<em>替代<i>的差别.在本章稍后,我们也会接头几个其他短语元素以及它们在切合尺度,布局化标签语法内的重要性.
你或者传闻过某些人提议在必要粗体笔墨时要用<strong>替代<b>,可是他却没有进一步汇报你为什么必要这样的替代.在不知道"为什么"的环境下,其实很难等候其他网页计划者只由于听过必要这样做就改变他们对标签的行使风俗. 为什么<strong>和<em>比<b>和<i>好?
去掉<b>和<i>标签,替代成<strong>和<em>到底是有什么甜头呢?其拭魅这统统都是为了表达语义和布局,而不是为了只是表现结果,本书的全部示例也都全力遵循这个观念. 看看专家怎么说
起首,来看看W3C在HTML4.01的短语元素类型里是怎么论述<strong>和<em>的(#h-9.2.1):
短语元素能在笔墨片断之内加上布局信息,常见的短语元素意义如下:
<em> 代表夸大
<strong> 代表更凶猛的夸大
以是在此接头的是两种差异水平的夸大.举例来说,就是一个单字可能短语,念的时辰应该较量高声,音调较高,念的快些,可能是...嗯,就是比一样平常笔墨内容更夸大.
W3C接着还论述了下面这段内容:
短语元素的展示结果跟着赏识器的差异,一样平常来说可视化赏识器应该以斜体表现<em>的笔墨内容,以粗体表现<strong>的笔墨内容.语音合成软件则能共同内容改变合成参数,像是音量,音调与速率等等.
啊哈!最后一句出格故意思,语音合成软件(之前我们称之为屏幕阅读器)将会正确处理赏罚必需夸大的笔墨,这简直是件功德.
相对之下,<b>或是<i>只是纯真的表现结果标签.假如我们的方针是将布局与表现结果疏散的话,行使<strong>和<em>就是正确的选择,纯真想要表现粗体,斜体笔墨的时辰用css就好了.本章稍后会接头更多例子.
接着看两个标识示例,辅佐我们相识它们的差别. 要领A
your order number for future reference is: <b>6474-82071</b>. 要领B
your order number for future reference is: <strong>6474-82071</strong>. 又粗又瑰丽
这个环境是行使<strong>比<b>更得当的美满例子,我们规划让句子内的特定笔墨表现的越发重要.除了粗体表现订单编号以外,我们也但愿屏幕阅读器也改变它们表达这段内容的方法:晋升音量,改变音调或速率.要领B可以或许同时到达这两个目标. <em>又怎样?
同样的,以<em>代替<i>,可以或许同时表达重要性,而不但纯真的以斜体表现笔墨内容.来看看这两个例子: 要领A
It took me notone,but<i>three</i> hours to shovel my driveway this morning. 要领B
It took me notone,but<em>three</em> hours to shovel my driveway this morning. 夸大语气
在前面的例子里(本书撰写时的真实环境),我的目标是使"three"这个字以夸大语气示意,犹如我高声念出这个字,视觉上,要领B在大大都赏识器里城市以斜体表现,而屏幕阅读器也会恰当的调解音色,速率或音量. 只要粗体或斜体就好
必需留意的是,许多环境下只必要视觉上展示粗体,斜体的笔墨结果,换句话说,假设你的侧边栏里有一串链接列表,而你喜好让全部链接用沟通的结果表现:也就是粗体(图6-1)

图6-1.粗体链接放在侧边栏里的示例
除了视觉特色外,我们并不规划出格夸大链接内容,这里就是以CSS改变链接外面表现结果的甜头所,让他们不会被屏幕阅读器以及其他非可视化赏识器出格夸大.
举例来说,你真的想让粗体链接被念得更快,更高声,音调更高吗?或许不会,这边的粗体完全只是表现结果. font-weight相等于粗体
为了到达图6-1的表现结果,让我们假设链接栏放在id设为sidebar的<div>中,这样我们就能用CSS指定#sidebar之内的链接要以粗体表现:
#sidebar a{
font-weight:bold;
}
十分简朴,让我认为一提起就有些好笑,可是这简直是个辅佐疏散布局与表现结果的好要领. 那是粗体!
同样的,在思索斜体笔墨的时辰也能应用相同的设法,在你不想夸大的内容,只纯真想以斜体表现笔墨时,你能再度行使font-style属性通过CSS处理赏罚这些状况
让我们行使沟通的#sidebar作为示例,举例来说假如你想使#sidebar里的全部链接表现成斜体,那么可以这样写:
#sidebar a{
font-style:italic;
}
又是个简朴至极的观念,可是在布局化标志语法的规模里,我认为接头这些环境异常重要--行使CSS处理赏罚央视,取代表现结果标签的状况.有些时辰最简朴的办理要领也最轻易被忽略. 共用粗体与斜体
在规划同时用粗体和斜体表现笔墨内容的时辰,我认为必需先思索一个题目,你规划通报什么水平的夸大?按照这个题目的谜底,我会选择恰当的标签:<em>(夸大)或<strong>(更凶猛的夸大),然后以选择的标签标志笔墨.
举例来说,以下面的例子来说,我本来规划让"fun"同时以粗体,斜体表现,最后我选择用<em>来夸大这个字.
Building sites with web standards can be <em>fun</em>!
大大都赏识器只会以斜体来表现这个字,要同时行使粗体和斜体,我们有几种选择.哦,我真的但愿你赞成上面这句话. 平凡的<span>
要领之一,是以平凡的<span>包在"fun"之外,而且指定CSS法则将全部<em>之内的<span>以粗体表现.标志语法看起来像这样:
Building sites with web standards can be <em><span>fun</span></em>!
而CSS看起来则像这样:
em span{
font-weight:bold;
}
明明的语义部门并欠好,由于我们加上了特另外标签,可是这个要领大家如故有效. 以class夸大
另一个要领例是为<em>标签指定一个class,而且以CSS加上粗体结果,标志语法看起来像这样:
Building sites with web standards can be <em class="bold">fun</em>!
而CSS看起来则像这样:
em.bold{
font-weight:bold;
}
行使<em>就能告竣斜体结果(同时在语义上夸大了笔墨内容),而为它加上bold class则会使<em>之内的笔墨以粗体表现.
相同的要领也能用来修饰<strong>.这时我们能在加重夸大某段笔墨的时辰,计划italic class加上斜体结果,再配上<strong>原本就有的粗体结果.
标志说话看起来像这样:
Building sites with web standards can be <strong class="italic">fun</strong>!
而CSS则是这样:
strong.italic{
font-style:italic;
}

1

(编辑:湖南网)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    热点阅读