引入css的方式及link和@import的区别

来源：互联网发布：sql server 2008怎么用编辑：程序博客网时间：2024/06/05 15:58

昨天去面试web前端，发现自己很多不足！基础知识不扎实，面试题很多问题我回忆了下，记下的一些问题在这里做个记录。很多问题因为只是站立在开发完成功能的目的，没有深究其原理。

四种引入方式：

1、内联方式

直接在html标签中style属性添加css

eg. <div style="line-height:10px;"></div>

这种方式只能改变当前样式，如果每个div需要相同的样式，不得不重复添加相同的样式，使代码冗余长。个人觉得这样写页面太乱。

2、嵌入方式

直接在头部标签中直接书写style属性

eg.

<head>

body,html{ margin:0;padding；0}

</head>

这种方式多个页面加载同一个css时需要写多次，代码冗余。

3、链接方式

头部link引入css文件

eg.

<head>

</head>

4、导入方式

使用css规则引入外部css文件

eg.

<style>

@import url(style.css)

<style>

两者相同点：都是外部引入css

两者区别：

1、link可以引入css文件，还可以定义rss等其他事物；@import输入css范畴，只能加载css

2、link在页面加载时同时加载css,@import在页面加载完再加载

3、link是xhtml,无兼容性问题；@import是css2.1提出的，低版本浏览器不支持

4、link支持jsDOM操作去改变样式，@import不支持

0 0