您当前的位置：首页 > 建站常识 > css强化

css link和@import区别用法

2016-02-02

　　css link和@import区别

　　这里link与@import介绍的是html引入css的语法单词。两者均是引入css到html的单词。

　　一、了解基本

　　1、link语法结构

　　<link href="CSSurl路径" rel="stylesheet" type="text/css" />

　　href 值为外部资源地址，这里是css的地址

　　rel 定义当前文档与被链接文档之间的关系,这里是外部css样式表即stylesheet

　　type 规定被链接文档的 MIME 类,这里是值为text/css

　　实际应用截图：

　　此标签是引入CSS文件link标签，只要设置好路径即可。

　　2、@import语法结构

　　@import + 空格+ url(CSS文件路径地址);

　　1）、在html中

　　@import url(CSS文件路径地址);

　　</style>

　　import在html中使用截图：

　　2）、在css中

　　直接使用@import url(CSS文件路径地址);

　　import在CSS代码或CSS文件中使用截图

　　在css和html中均可以使用@import

　　二、link与@import区别与选择

　　首页link和import语法结构不同，前者<link>是html标签，只能放入html源代码中使用，后者可看作为css样式，作用是引入css样式功能。import在html使用时候需要<style type="text/css">标签，同时可以直接“@import url(CSS文件路径地址);”放如css文件或css代码里引入其它css文件。

　　本质上两者使用选择区别不大，但为了软件中编辑布局网页html代码，一般使用link较多，也推荐使用link。

　　如需转载，请注明文章出处和来源网址：http://www.20707.net/cs/qh/317.html

　　扩展阅读：

　　使用link来引用外部的css的优势

　　1、有利于SEO，使用此方法引用外部css文件，将使得html页面的源代码少很多比起直接加入css样式，因为搜索引擎蜘蛛爬行网页的时候是不爬行css文件的，这样使得html源代码很少，使得蜘蛛爬行更快，处理更少，增大了此网页的权重，有利于排名。

　　2、节约html使得浏览器下载网页时候分开线程了，就像加载一个页面同时有两条线在打开一个页面道理，使得网页打开格外快。（用户浏览此网页的时候html源代码和css文件同时下载，使得更加快速）

　　3、修改网页的样式方便，只需修改css样式即可修改网页的美工样式，如果在网站项目中此方法，因整站应用了共用的css基本样式，这样修改整站风格样式根据快捷方便。

本文关键词：