整合营销服务商
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
例
一个简单的 HTML 文档，包含尽可能少的必需的标签：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>文档标题</title>
</head>
<body>
文档内容......
</body>
</html>
浏览器支持
所有主流浏览器都支持 <body> 标签。
标签定义及使用说明
<body> 标签定义文档的主体。
<body> 元素包含文档的所有内容（比如文本、超链接、图像、表格和列表等等）。
HTML 4.01 与 HTML5之间的差异
在 HTML 5 中，删除了所有 body 元素的"呈现属性"。
在 HTML 4.01 中，所有 body 元素的"呈现属性" 已废弃。
属性
| 属性 | 值 | 描述 |
|---|---|---|
| alink | color | HTML5 不支持。 HTML 4.01 已废弃。 规定文档中活动链接的颜色。 |
| background | URL | HTML5 不支持。 HTML 4.01 已废弃。 规定文档的背景图像。 |
| bgcolor | color | HTML5 不支持。 HTML 4.01 已废弃。规定文档的背景颜色。 |
| link | color | HTML5 不支持。 HTML 4.01 已废弃。规定文档中未访问链接的颜色。 |
| text | color | HTML5 不支持。 HTML 4.01 已废弃。规定文档中所有文本的颜色。 |
| vlink | color | HTML5 不支持。 HTML 4.01 已废弃。规定文档中已被访问链接的颜色。 |
全局属性
<body> 标签支持 HTML 的全局属性。
事件属性
<body> 标签支持 HTML 的事件属性。
如您还有不明白的可以在下面与我留言或是与我探讨QQ群308855039，我们一起飞！
悉前端的小伙伴都知道网站的性能和网页代码有很大的关系，这里指网页代码主要是指前端代码(html、css、js代码)，而css合理使用很大关系上影响网站页面各种性能，今天主要给大家分析下css中@import和link使用和区别？
css中的@import和link
在css中@import 导入指定的的外部样式表及目标媒体，css导入外部文件主要是通过link和@import实现的，它们都各自的语法结构。如果不清楚css基础知识可翻看之前发的文章。
@import代码示例如下：
<style type="text/css">
@import url(路径地址/test.css);
</style>
link的代码示例如下：
<link href="路径地址/test.css" rel="stylesheet" type="text/css" />
css中@import和link的区别
1、属性不同
link是html提供的标签，不仅可以加载css文件，还能定义 RSS、rel 连接属性等。而
@import是css中的语法规则
2、加载顺序不同
页面打开时，link引用的css文件被加载。而@import引用的CSS等页面加载完后最后加载。
3、兼容性
@import是css2.1后提出的，而link是不存在兼容问题。
4、DOM控制性
js操作DOM，可以使用link改变样式，无法使用@import的方式使用样式。
使用@import和link的注意事项？
1、css中避免过多使用 @import
如果了解了@import原理，你就会明白它的性能并不高，过多使用它会延长浏览器渲染页面的时间。
2、@import可以在css中引入其他样式表利于修改和扩展。
代码示例如下：
index.css
———————-
@import “test1.css”;
@import “test2.css”;
test1.css
———————-
p {color:blue;}
test2.css
———————-
.mystyle {color:red}
好了关于“css中的link和@import引用”先聊到这，大家有什么更好想法欢迎评论。每天学习一个知识点，每天进步一点点。每日寄语”志不立，如无舵这舟，无衔之马，漂荡奔逸，终亦何所底乎。”下一期咱们接着聊。
击右上方红色按钮关注“web秀”，让你真正秀起来
先回答区别，再扩展一下。
区别1：link是XHTML标签，除了加载CSS外，还可以定义RSS等其他事务；@import属于CSS范畴，只能加载CSS。
区别2：link引用CSS时，在页面载入时同时加载；@import需要页面网页完全载入以后加载。所以会出现一开始没有css样式，闪烁一下出现样式后的页面(网速慢的情况下)
区别3：link是XHTML标签，无兼容问题；@import是在CSS2.1提出的，低版本的浏览器不支持。
区别4：link支持使用Javascript控制DOM去改变样式；而@import不支持。在html设计制作中，css有四种引入方式。
内联样式，也叫行内样式，指的是直接在 HTML 标签中的 style 属性中添加 CSS。
示例：
<div style="display: none;background:red"></div>
这通常是个很糟糕的书写方式，它只能改变当前标签的样式，如果想要多个 <div> 拥有相同的样式，你不得不重复地为每个 <div> 添加相同的样式，如果想要修改一种样式，又不得不修改所有的 style 中的代码。很显然，内联方式引入 CSS 代码会导致 HTML 代码变得冗长，且使得网页难以维护。
嵌入方式指的是在 HTML 头部中的 <style> 标签下书写 CSS 代码。
示例：
<head>
<style>
.content {
background: red;
}
</style>
</head>
嵌入方式的 CSS 只对当前的网页有效。因为 CSS 代码是在 HTML 文件中，所以会使得代码比较集中，当我们写模板网页时这通常比较有利。因为查看模板代码的人可以一目了然地查看 HTML 结构和 CSS样式。因为嵌入的 CSS 只对当前页面有效，所以当多个页面需要引入相同的 CSS 代码时，这样写会导致代码冗余，也不利于维护。
链接方式指的是使用 HTML 头部的 标签引入外部的 CSS 文件。
示例：
<head> <link rel="stylesheet" type="text/css" href="style.css"> </head>
这是最常见的也是最推荐的引入 CSS 的方式。使用这种方式，所有的 CSS 代码只存在于单独的 CSS文件中，所以具有良好的可维护性。并且所有的 CSS 代码只存在于 CSS 文件中，CSS 文件会在第一次加载时引入，以后切换页面时只需加载 HTML 文件即可。
导入方式指的是使用 CSS 规则引入外部 CSS 文件。
示例：
<style> @import url(style.css); </style>
或者写在css样式中
@charset "utf-8";
@import url(style.css);
*{ margin:0; padding:0;}
.notice-link a{ color:#999;}
链接方式（下面用 link 代替）和导入方式（下面用 @import 代替）都是引入外部的 CSS 文件的方式，下面我们来比较这两种方式，并且说明为什么不推荐使用 @import。
1、link 属于 HTML，通过 <link> 标签中的 href 属性来引入外部文件，而 @import 属于 CSS，所以导入语句应写在 CSS 中，要注意的是导入语句应写在样式表的开头，否则无法正确导入外部文件；
2、@import 是 CSS2.1 才出现的概念，所以如果浏览器版本较低，无法正确导入外部样式文件；
3、当 HTML 文件被加载时，link 引用的文件会同时被加载，而 @import 引用的文件则会等页面全部下载完毕再被加载；
小结：我们应尽量使用 <link> 标签导入外部 CSS 文件，避免或者少用使用其他三种方式。
喜欢小编或者觉得小编文章对你有帮助的，可以点击一波关注哦！同时，要源码的小伙伴可以点击下方“了解更多”。
原文链接：https://segmentfault.com/a/1190000003866058
*请认真填写需求信息，我们会在24小时内与您取得联系。
