[翻译]标记语言和样式手册 chapter 6 短语元素(7)
作者:zhaozy 来源:3user.com 发布时间:2008-01-25 16:37:00
兼容性问题
值得一提的是,在本书撰写的时候,windows版的Internet Explorer还不支持为<abbr>标签指定样式,显示工具提示. IE/Win支持<acronym>标签,这是为了鼓励某些设计者只使用<acronym>处理缩写名词与略称.
这么做或许很有吸引力,但是为了解决现实问题而使用错误的元素并不是件好事,对这个特定问题来说,我偏好根据规范表示名词,让正确支持的浏览器处理<abbr>标签的样式.让我们很快地看看几个还没提到的短语元素.
<code>
<code>元素的设计目的是在XHTML页面内展示代码示例,举例来说,当你想分享某段CSS时,你可以这样写:
<code>
#content {
width: 80%;
padding: 20px;
background: blue;
}
</code>
一般来说,可视化浏览器会以定宽serif字体显示<code>标签中的内容.当然,我们也能加上CSS规则,指定我们喜欢的显示方式.
code {
font-family: Courier, serif;
color: red;
}
如此一来,<code>的内容就会变成红色的Courier字体了.
<samp>
<samp>元素是用来标识程序与script的示例输出的,举例来说,如果我想讨论正在编写的Perl script输出结果,我可能会标集成这样:
<p>When the script has executed, at the command line you will see the message <samp>script was successful!</samp>.</p>
这边我以<samp>把script的输出示例围起来,同时我们也能以CSS规则为程序输出示例设定独特的样式,就像刚才为<code>做的一样.
<var>
与<samp>相关的,<var>是用来标记程序的变量和引用用的,举例来说,如果我们正在讨论XSLT样式表,那么我能写下:
<p>I'm going to pass the parameter <var>lastUpdated</var> to my main.xsl file.</p>
许多浏览器会以斜体显示<var>标签的内容,但是你可以写一条简单的规则去掉预设值,如果你不喜欢斜体的话.我们能用CSS的font-style属性改变显示效果:
var {
font-style: normal;
font-family: Courier, serif;
color: purple;
}
最后让我们看看<kbd>元素,完成短语元素的部分.
<kbd>
<kbd>元素可以用来标记使用者要输入的文字,举例来说,如果我正在解释如何使用刚才指定的accesskey把光标切换到搜索框内,我可能会这样写:
<p>To quickly change focus to the search input field, Mac users type <kbd>Command+9</kbd>.</p>
你大概猜得到我接下去要说什么了,没错,只要使用简单的CSS规则,你就能调整所有的<kbd>元素的样式,与其他短语元素一样.
结论
回顾一下在这章中看过的内容,首先探讨<strong>和<em>优于同等显示效果的<b>和<i>的原因,同时也研究了如何单纯设定粗体或斜体显示效果,CSS是正确的方法.
也讨论了其他的短语元素,以<cite>标记人物,出版物开始,并证明了结构化标记语法对显示效果,资料解析的好处.
并示范了如何以适当的元件标记缩写名词,略称,提升网页的易用性,同时以额外的CSS展示,语音规则强化定义内容.最后则看到剩下的短语元素,每个元素都具备一般文字不同的预设样式,但是我们也能快速地为单一页面或者整个网站轻易的设计简单的CSS规则,为这些元素指定想要的显示样式.


猜你喜欢
- 视图函数中加上认证功能,流程见下图import hashlibimport timedef get_random(name):
- 案例:该数据集的是一个关于每个学生成绩的数据集,接下来我们对该数据集进行分析,判断学生是否适合继续深造数据集特征展示1 GRE
- * 上有个有意思的话题叫细胞自动机:https://en.wikipedia.org/wiki/Cellular_automaton在2
- 本文实例讲述了PHP简单检测网址是否能够正常打开的方法。分享给大家供大家参考,具体如下:这是一个检测网址是否能正常打开的PHP代码,通过下面
- 使用webpack搭建单页面程序十分常见,但在实际开发中我们可能还会有开发多页面程序的需求,因此我研究了一下如何使用webpack搭建多页面
- 前几天因为一个例外,数据库在没有做备份的情况下,直接删除了表记录。事后,又需要查询到删除的记录的内容。因此,在网上软件SS了半天,发现Log
- 什么是内存逃逸分析内存逃逸分析是go的编译器在编译期间,根据变量的类型和作用域,确定变量是堆上还是栈上简单说就是编译器在编译期间,对代码进行
- 1. 前言春联是中国传统文化中最具内涵的元素之一,它以对仗工整、简洁精巧的文字描绘美好形象,抒发美好愿望,是中国特有的文学形式,是华人们过年
- pcntl扩展可以支持php的多线程操作(仅限linux)原本需要重新编译PHP的后面configrue提示加上--enable-pcntl
- 速查表是帮你记住东西的有效工具。Web设计师和开发者经常使用的快捷键简表会使他们在网上的工作效率大大提高。事实上,速查表就是来帮助我们把日常
- 本文实例讲述了Python自定义函数计算给定日期是该年第几天的方法。分享给大家供大家参考,具体如下:写一个函数,计算给定日期是该年的第几天.
- 标准XMLHttpRequest操作 方法描述abort()停止当前请求getAllResponseHeaders()把HTTP请求的所有响
- 介绍当在图像上训练深度神经网络模型时,通过对由数据增强生成的更多图像进行训练,可以使模型更好地泛化。常用的增强包括水平和垂直翻转/移位、以一
- 起步Python 的成功一个原因是它的可读性,代码清晰易懂,更容易被人类所理解,但有时可读性会产生误解。假如要判断一个变量是不是 17,那可
- 使用addEventListener事件触发执行函数的this在普通的dom操作中,若是使用addEventListener如下面的例子&l
- 方法一:引入System.Web.Script.Serialization命名空间使用 JavaScriptSerializer类实现简单的
- scrapy是目前python使用的最广泛的爬虫框架架构图如下解释:Scrapy Engine(引擎): 负责Spider、ItemPipe
- 图片缩放会失真是真理,在浏览器里也一样,貌似使用传说中的双三次插值可以让失真看起来比较不明显,但是真的想不通IE7已经实现了,却不默认打开,
- Paddle模型性能分析Profiler定位性能瓶颈点优化程序提升性能Paddle Profiler是飞桨框架自带的低开销性能分析器,可以对
- HTML5,被传为Flash 的杀手,是一种用于web 应用程序开发、具有变革意义的网络技术。HTML 5提供了一些新的元素和属性,其中有些