CSS:Cascading Style Sheets(层叠样式表)
有三种方式可以在XHTML页面中嵌入CSS.参见CSS教程.
在head标签中加载一个CSS文件
示例
<head><linkrel="stylesheet"type="text/css"href="style.css"/></head>
此例使用了link标签.
abbr{font-size:12px;}.text10pxwhite{font-size:10px;color:#FFFFFF;}
style.css的内容
直接把CSS内容写在HTML文件的head标签中
示例
<head><styletype="text/css">abbr{font-size: 12px;}.text10pxwhite{font-size: 10px;color: #FFFFFF;}</style></head>
此例使用了style标签.
两种方法是殊途同归的(但是推荐使用第一种方法,在CSS教程中我将告诉你为什么).
使用style属性对标签加载样式
示例
<pstyle="font-size: 12px;color: #000;">使用css</p>
HTML style 标签
style 标签 -- 在文档中声明样式时使用此标签
- style标签是成对出现的,以
<style>开始,以</style>结束 - 属性
media-- 媒体类型,参见CSS高级教程type-- 包含内容的类型,一般使用type="text/css"
示例
<head><styletype="text/css">abbr{font-size: 12px;}.text10pxwhite{font-size: 10px;color: #FFFFFF;}</style></head>
HTML link 标签
link 标签 -- 当在文档中声明使用外接资源(比如CSS)时使用此标签
示例
<head><linkrel="stylesheet"type="text/css"href="style.css"/></head>
HTML rel rev属性
- rel，rev属性通常出现在a,link标签中
- 属性值
- alternate -- 定义交替出现的链接
appendix-- 定义文档的附加信息bookmark-- 书签- canonical -- 规范网页是一组内容高度相似的网页的首选版本
chapter-- 当前文档的章节contentscopyright-- 当前文档的版权glossary-- 词汇help-- 链接帮助信息index-- 当前文档的索引- next -- 记录文档的下一页.(浏览器可以提前加载此页)
nofollow-- 不被用于计算PageRank- prev -- 记录文档的上一页.(定义浏览器的后退键)
section-- 作为文档的一部分- start -- 通知搜索引擎,文档的开始
- stylesheet -- 定义一个外部加载的样式表
subsection-- 作为文档的一小部分
- rel是relationship的英文缩写
rel与rev属性相同,它们都是属于LinkTypes属性.
示例
<linkrel="stylesheet"href="http://www.dreamdu.com/style.css"type="text/css">
rel与rev的区别
rel与rev具有互补的作用,rel指定了向前链接的关系,rev指定了反向链接的关系.
HTML alternate 属性值
alternate 属性值 -- alternate是LinkTypes的一个值,网页设计者可以通过此值,设计交替出现的链接
示例
定义两种不同的样式,用户可以通过浏览器选择样式(ie不支持此属性)
<linkrel="stylesheet"type="text/css"title="blue"href="dreamdublue.css"/><linkrel="alternate stylesheet"type="text/css"title="red"href="dreamdured.css"/>
可以通过http://www.dreamdu.com/feed/读取http://www.dreamdu.com/的内容
<linkrel="alternate"type="application/rss+xml"href="http://www.dreamdu.com/feed/"/>
HTML start next prev 属性值
start next prev 属性值 -- start next prev,全部属于LinkTypes,此值通常可以提示浏览器文章的开始,下一篇,上一篇的url
示例
<linkrel="start"type="text/html"href="http://www.dreamdu.com/xhtml/"/><linkrel="prev"type="text/html"href="http://www.dreamdu.com/xhtml/alternate/"/><linkrel="next"type="text/html"href="http://www.dreamdu.com/xhtml/attribute_rel/"/>
HTML rel canonical 属性值
rel canonical 属性值 -- rel="canonical"属性让搜索引擎知道当前网站中的重复或相似网页中，哪一个页面才是站长想让其抓取与收录的
- canonical属性值通常在，rel属性中出现
- 引用网址:http://www.dreamdu.com/xhtml/rel_canonical/
- canonical从功能上来讲，可理解为301永久重定向的辅助功能
- canonical可以与相对链接或绝对链接一起使用，但是建议使用绝对链接
- Google对canonical的定义是：规范网页是一组内容高度相似的网页的首选版本
- canonical：中文"典范"的意思
示例
<linkrel="canonical"href="http://dreamdu.com/"/>
指定网页http://www.dreamdu.com/为搜索引擎应收录的链接（规范链接）。可以将上述代码复制到所有非规范网址的head部分，例如网址www.dreamdu.com、www.dreamdu.com/default.html、www.dreamdu.com/index.html等