天天看点

html引入html include_CSS的引入方式笔记

CSS一共有五种引用方式。

1、直接在body、h1等标签里面写标签或者属性,这种叫做

行内式

,不过这种基本已经

废弃

了:

<body bgcolor='grey'>——body的背景颜色为红色;

<h1><center><font color='red'>轰</font></center></h1>——hi标签居中,并且颜色为红色

2、在body、h1等标签里面写上style,这种叫做style属性,把样式写在标签上,也叫所style

内联样式

,这种方式会导致html代码冗长:

<body style="background-color: grey">——body的背景颜色为灰色;

<h1 style='text-align: center; color: red;'>唐</h1>——hi标签剧中,并且颜色为红色。这里一个style=后面把里面的属性都放到引号里面包起来。以英文的分号;隔开各个属性。

3、一般在head标签里面写一个style标签,不写在head标签里面也可以,这种叫做style嵌入式。这种方式会使

标签

变得比较

简洁

,但是也会导致html代码冗长,但是可以集中看到css样式。

<head>

<style>

body{

background-color: grey

}

h1{

text-align: center; color: red;

}

</style>

</head>

4、style外部式,通过html文件外部引入一个CSS,也就是把第三种方法中的style放到html意外的CSS中去即可,这样会使html代码变得

简洁

很多。这种是现在用的最多的,但是html中需要写入引用代码:

<head>

<link rel="stylesheet" href="./style.css" target="_blank" rel="external nofollow" >

</head>

rel就是relationship(关系),CSS就是一种stylesheet,引用到./就是当前目录下的style.css文件。

通过在该文件夹下使用git bash,输入http-server -c -1来是使用http协议打开

html引入html include_CSS的引入方式笔记

输入http://192.168.1.2:8080就可以使用http协议打开,看到html.html通过了get请求得到style.css

html引入html include_CSS的引入方式笔记

5、最后一种,用的不多,就是CSS里面引入另外一CSS。

@import url(./b.css);
           

括号里面先对路径和绝对路劲都可以。

html引入html include_CSS的引入方式笔记
本文为本人的原创文章,著作权归本人和饥人谷所有,转载务必注明来源