HTML标记语言——引用
互联网 发布时间:2008-10-17 18:55:18 作者:佚名
我要评论
点击这里返回网页教学网 HTML教程 栏目.
上文:标记语言——邪恶表格
原文出处
Chapter 4 引用
“Misquotations are the only quotations tha are never misquoted” (只有错误的引用永远不会被误用)
- Hesketh Pearson
所有类型的
概要
让我们快速回顾一下,为什么方法C在标记长引用的时候比其他两种方法棒.
方法A: 无法轻易加上不同的样式,使它与页面其他内容区分开来 不提供任何引用的语义,结构标识.
方法B: 加上独特的分类让我们易于指定样式,但是<blockquote>可用,所以根本不需要 如果想要维持页面/网站的风格一致,在标记未来新增引用的时候,我们就会被限制在这个方法里面
方法C: 这是W3C为这个目标所设计的元素,能够标识内容的意义,结构. 容易使用CSS为<blockquote>元素内部的引用加上独特样式. 缺少CSS的时候,<blockquote>预设的表现方式足以让可视化,非可视化浏览器提供暗示.
现在是为<blockquote>打扮一番,寻找样式创意的好机会. 技巧延伸
我们来看看怎么为<blockquote>标签的引用内容上加上一些有创意的样式.不过在这之前,让我们先谈谈cite属性与行内引用. 给好奇宝宝的参考资料
对迂腐的标题感到厌倦了么?很好,我也是.在讨论引用的时候,一定得提到cite属性,根据W3C的规范,cite属性的目的是让设计者参照引用的出处,也就是说,如果引用是从其他网页摘录下来的,我们就可以在cite属性内记录那份网页的url.
让我们看看怎么书写这个属性:
在书写这段文字的时候,大多数浏览器都不会特别处理我们刚加上的cite属性,但是在能够处理cite属性的进阶css技巧或者scripting程序出现之后,事情就会开始变得有趣了.引言出处本身也是帮助描述标签内容的额外资讯,未来将会十分具有价值.
试着把加上cite想成把硬币丢进储蓄罐,这些硬币现在值不了多少,但是未来你将会庆幸一路上你有把它们全部存起来.行内引用
让我们快速回顾一下,为什么方法C在标记长引用的时候比其他两种方法棒.
方法A: 无法轻易加上不同的样式,使它与页面其他内容区分开来 不提供任何引用的语义,结构标识.
方法B: 加上独特的分类让我们易于指定样式,但是<blockquote>可用,所以根本不需要 如果想要维持页面/网站的风格一致,在标记未来新增引用的时候,我们就会被限制在这个方法里面
方法C: 这是W3C为这个目标所设计的元素,能够标识内容的意义,结构. 容易使用CSS为<blockquote>元素内部的引用加上独特样式. 缺少CSS的时候,<blockquote>预设的表现方式足以让可视化,非可视化浏览器提供暗示.
现在是为<blockquote>打扮一番,寻找样式创意的好机会. 技巧延伸
我们来看看怎么为<blockquote>标签的引用内容上加上一些有创意的样式.不过在这之前,让我们先谈谈cite属性与行内引用. 给好奇宝宝的参考资料
对迂腐的标题感到厌倦了么?很好,我也是.在讨论引用的时候,一定得提到cite属性,根据W3C的规范,cite属性的目的是让设计者参照引用的出处,也就是说,如果引用是从其他网页摘录下来的,我们就可以在cite属性内记录那份网页的url.
让我们看看怎么书写这个属性:
<blockquote cite="http://www.somewebsite.com/path/to/page.html"
<p>Misquotations are the only quotations that are never
misquoted.</p>
<p>— Hesketh Pearson </p>
</blockquote>
在书写这段文字的时候,大多数浏览器都不会特别处理我们刚加上的cite属性,但是在能够处理cite属性的进阶css技巧或者scripting程序出现之后,事情就会开始变得有趣了.引言出处本身也是帮助描述标签内容的额外资讯,未来将会十分具有价值.
试着把加上cite想成把硬币丢进储蓄罐,这些硬币现在值不了多少,但是未来你将会庆幸一路上你有把它们全部存起来.
行内引用
要怎么处理简短,应该是在行内参考的引用呢?举例来说,如果你在这句子中提到其他人说过的话,这时就可以用<q>标签:
I said, <q>Herman, do you like bubblegum?</q> And he said,<q>Yes, the kind that comes with a comic.</q>
这在可视化浏览器上多半会显示成这样:
I said, Herman, do you like bubblegum?
And he said, Yes, the kind that comes with a comic.
不需要引号
大多数可视化浏览器会在使用<q>和</q>的时候自动加上引号,因此你不用自己输入,W3C也建议加上lang属性标识所应用的内容语言,某些语言可能会显示不同的引号.
I said, <q lang="en-us">Herman, do you like bubblegum? </q> And he said, <q lang="en-us">Yes, the kind that comes with a comic.</q>
你可以在W3C的网站上找到所有可用的语言代码.(www.w3.org/TR/html4/struct/dirlang.html#langcodes)
嵌套的行内引用
你也能在引用内容中嵌套引用其他文字,搞混了么?我也是,来看看示例吧:
I said, <q lang="en-us">Herman, do you like bubblegum? </q> And he said, <q lang="en-us">Yes. Bubblegum is what Harry calls <q lang="en-us">delicious</q>.</q>
此时浏览器会在适当的地方使用双引号和单引号,像是这样.
I said, Herman, do you like bubblegum?
And he said, Yes. Bubblegum is what Harry calls delicious
.
I said, <q>Herman, do you like bubblegum?</q> And he said,<q>Yes, the kind that comes with a comic.</q>
I said, <q lang="en-us">Herman, do you like bubblegum? </q> And he said, <q lang="en-us">Yes, the kind that comes with a comic.</q>
delicious.相关文章
文章介绍了HTML中img标签的使用,包括src属性(指定图片路径)、相对/绝对路径区别、alt替代文本、title提示、宽高控制及边框设置等,本文主要给大家介绍HTML img标签和超链2025-06-20- HTML meta标签用于提供文档元数据,涵盖字符编码、SEO优化、社交媒体集成、移动设备适配、浏览器控制及安全隐私设置,优化页面显示与搜索引擎索引,本文给大家介绍HTML中meta2025-06-20
input 标签主要用于接收用户的输入,随 type 属性值的不同,变换其具体功能,本文通过实例图文并茂的形式给大家介绍HTML input 标签,感兴趣的朋友一起看看吧2025-06-20
这篇文章主要介绍了html 滚动条滚动过快会留下边框线的解决方案,解决方法很简单,可以将 dialog 单独拿出来别放在 transform 的子元素里,需要的朋友可以参考下2025-06-09- 本文将介绍如何使用<img>标签在 HTML 中添加图片,并展示一些常见的用法和技巧,通过本文的介绍,应该掌握了在 HTML 中添加和调整图片的基础知识,感兴趣的朋友一起看2025-05-16
- HTML表格用于在网页上展示数据,通过标签及其相关标签来创建,表格由行和列组成,每一行包含一个或多个单元格,单元格可以包含文本、图像、链接等元素,本文将详细介绍HTML表格2025-03-12
- 本文介绍了三种禁止HTML页面滚动的方法:通过CSS的overflow属性、使用JavaScript的滚动事件监听器以及使用CSS的position:fixed属性,每种方法都有其适用场景和优缺点,感兴2025-02-24
在 Web 开发中,文本的视觉效果是提升用户体验的重要因素之一,通过 CSS 技巧,我们可以创造出许多独特的效果,例如文字镂空效果,本文将带你一步一步实现一个简单的文字镂空2024-11-17
在Html中,a标签默认的超链接样式是蓝色字体配下划线,这可能不满足所有设计需求,如需去除这些默认样式,可以通过CSS来实现,本文给大家介绍Html去除a标签的默认样式的操作代码2024-09-25- 在HTML中,可以通过设置CSS的resize属性为none,来禁止用户手动拖动文本域(textarea)的大小,这种方法简单有效,适用于大多数现代浏览器,但需要在老旧浏览器中进行测试以确保2024-09-25






最新评论