css第二课:外部样式link和import的运用及行内样式的介绍
一:外部样式
1.先讲用link引入外部样式:
首先我们新建一个css文件夹,放外部css样式文件,然后创建一个css文件(.css),如下图:
新建一个html文件写代码,代码,在css文件里写样式,然后用link将这个css样式引入的html中,
如下图:
结果:
link属性介绍:rel=“stylesheet”、type=“text/css”为默认值不用管,href是你要写css样式的文件地址
2.用import引入外部标签
代码演示:
结果:
虽然两个都可以引入外部样式,但是还是有一些区别的,如下:
看了上面的区别,还是建议用link,不会出问题,但是注意一点:无论是link还是import都是在head里面引入的css外部样式哦
二、行内样式
行内样式,有的地方也称为内联样式、嵌入式样式
行内样式就是在要修饰的内容所在的标签里面写style,如下:
代码演示:
结果:
行内样式要修饰的每一个都要写,看起来有点乱,所以我们不经常用,当只有一个内容需要修饰的时候,才会去用,但这种情况很少存在,所以我们不经常用,我们经常用的是外部样式。
优先级问题:
当我们将三个样式都来修饰一个标签内容时,这时候就有标签优先级的问题了,
行内样式>内部样式>外部样式
此时还有一个东西就是“!important”,你将这个加载谁后面谁的优先级就是最大的,如下图所示:
结果:
所以优先级是:!important>行内样式>内部样式>外部样式
注意:这个!important是在声明的分号之前加的