免费教程 
成功案例 
VIP报名区 
建站交流 
建站回答 
网站建设 
网站优化 
VIP培训区 
网站首页第8节:HTML 资源链接
HTML资源链接
link元素在HTML文档和之间创建关系外部资源，CSS样式表或Javascript文件。
link元素具有局部属性:href，rel，hreflang，media，type，sizes。
-
href - 指定链路元素引用的资源的URL。
-
hreflang - 指定链接资源的语言。
-
media - 指定链接内容用于的设备。
-
rel - 指定文档和链接资源之间的关系类型。
-
sizes - 指定图标的大小。
-
type - 指定链接资源的MIME类型，例如
text/css或image/x-icon.
sizes属性已在HTML5中添加，属性charset，rev和target在HTML5中已过时。
rel属性值决定浏览器如何处理link元素。以下列表显示rel属性的常见值。
-
alternate - 指向文档的替代版本的链接，例如翻译成另一种语言的链接。
-
author - 链接到文档的作者。
-
help - 与当前文档相关的帮助的链接。
-
icon - 指定图标资源。
-
license - 指向与当前文档相关联的许可证的链接。
-
pingback - 指定pingback服务器，允许当其他网站链接到博客时自动通知博客。
-
prefetch - 预加载资源。
-
sylesheet - 加载外部CSS样式表。
例子
为了演示link元素，创建了一个名为styles.css的样式表，其具有以下内容。
a {
background-color: grey;
color: red;
padding: 0.5em;
}
要应用这个样式表，我们可以使用link元素，如下面的代码所示。
<!DOCTYPE HTML> <html> <head> <link rel="stylesheet" type="text/css" href="styles.css" /> </head> <body> <p>This is a test.</p> <a href="http://www.html.cn">Visit www.html.cn</a> </body> </html>
您可以使用多个link元素来加载多个外部资源。外部样式表可以在多个文档中重用。
预加载资源
您可以要求浏览器预加载资源。
下面的代码显示了使用link元素来指定预加载。
<!DOCTYPE HTML> <html> <head> <link rel="prefetch" href="/page2.html" /> </head> <body> <p>This is a test.</p> <a href="http://www.html.cn">Visit www.html.cn</a> <a href="page2.html">Page 2</a> </body> </html>
上面的代码将rel属性设置为prefetch，并指定HTML页面page2.html被加载，期望用户将使用此页面。
上一篇：第7节:HTML 样式
下一篇：第9节:HTML 基本标签
最新更新
猜你喜欢
关注我们
