html中如何导入css

html-css017

html中如何导入css,第1张

1、使用链接式

<link href="style.css" rel="stylesheet" type="text/css" />

2、使用导入式

<style type="text/css">

@import "style.css"

</style>

扩展资料:

二者的区别

导入式和链接式的目的都是将一个独立的css文件引入一个文件中,二者的区别不大,事实上,二者最大的区别在于链接式使用html的标记引入外部css文件,而使用导入式则是使用css规则引入外部css文件,因此它们的语法也不同。

采用这两种方式后的现实效果也略有区别。使用链接式时,会在装载页面主体部分 之前装载css文件,这样现实出来的页面从一开始就是带有样式效果的,而使用导入式时,会在整个页面装载完成之后再装载css文件,

对于有的浏览器来说, 在一些情况下,如果页面文件的体积比较大,则会出现先现实无样式的页面,闪烁一下之后再出现设置样式的效果。从浏览者的感受来说,这是使用导入式的一个缺陷。

通常标准是单独建个文件夹,专门用来放css的。如果要在页面写的话有三个地方可以写。

第一:<head></head>标签内,用<style type="text/css"></style>标记开始和结束,示例:

<head>

    <style type="text/css">

        css语句

    </style>

</head>

第二个地方就是直接在html标签内写,比如div、p、span这些。示例:

<div style="css语句"></div>

<p style="css语句"></p>

第三个是在js里面写,这个我也不熟,就不给示例了,希望可以帮到你。