如何在html中引入全局CSS

在使用css的时候为了方便需要单独定义一个css文件,也就是要定义一个全局的css文件,在定义了全局的css文件之后如何在html文件代码中引入css呢?下面的是方法:
css文件的文件扩展名是.css。
1、链接方式:
通过head标签中link标签来实现,前提也是先要有一个已定好的CSS文件。
例:
<link rel="stylesheet" type="text/css" href="css_3.css" />
注:可以通过多个link标签链接进来多个CSS文件。重复样式以最后链接进来的CSS样式为准。

上面看不明白的话,可以看下面的代码实例:rel的格式固定,href为css文件的路径
目录结构:

demo1代码:

全局css代码:



实体代码如下:
1、demo1:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>css 范例</title>
    <style type="text/css">
    /*CSS代码区域*/
    /*div{
        background-color:green;
    }*/
    </style>
    <link rel="stylesheet" href="index.css">
</head>
<body>
    <div style="background-color: yellow;">DIV1</div>
    <div>DIV2</div>
    <div>DIV3</div>
</body>
</html>
2、css:(新建一个以.css为扩展名的文件)
/*全局样式信息*/
div{
        background-color:green;
    }

猜你喜欢

转载自blog.csdn.net/tszching_leung/article/details/80709837