css的四种样式及其优先级

1.行内样式

代码

2.内嵌样式

代码

3.外链样式

代码

4.导入样式

5.四种样式的优先级

1.行内样式

行内样式又叫标签样式，它是在标签里面加上style属性

代码

<body><h1>捷克首都机场</h1><h2 style="color: red;">123456789</h2>
</body>

2.内嵌样式

样式写在style标签里面(style标签在head标签内)

代码

<head><meta charset="UTF-8"><title>Document</title><style type="text/css">h1{color: red;}</style>
</head>

3.外链样式

第一步：建立一个.css的文件,在里面写css样式

第二步：head标签内写入link标签(link可以存在在body标签里但是不推荐用)

第三步：link里href属性将css文件引入

代码

<head><meta charset="UTF-8"><title>Document</title><link rel="stylesheet" type="text/css" href="1.css">
</head>

4.导入样式

特点：把@import放在style标签中

<head><meta charset="UTF-8"><title>Document</title><style type="text/css">@import url(1.css);</style>
</head>

这种方式不推荐使用第一因为使用@import导入的css开始不会被加载只有在引用到他的时候浏览器才会下载去加载它这就导致了浏览器无法并行下载所需的样式文件第二如果有多个@import的时候在IE中下载顺序会被打乱 JavaScript无法解析到它网络不好的时候可能会导致浏览器混乱.。

5.四种样式的优先级

行内样式>内嵌样式>外链样式>导入样式

css的四种样式及其优先级相关推荐

CSS引入样式的四种方法及优先级顺序
CSS引入样式的几种方法 css可以通过4种方式引入样式表根据不同的需求可以选择不同的引入方式但是它们也有不同的优缺点行内样式嵌入式样式外部样式 @import 导入的方式 1.行内样式特 ...
CSS中的四种样式及选择器
CSS语法选择符表示要定义样式的对象,可以是元素本身,也可以是一类元素或者制定名称的元素. 属性:属性是指定选择符所具有的属性,它是css的核心,css2共有150多个属性属性值:属性值包括法定属 ...
引入css的方式的四种方式,引入css的四种方式
1.内联式引用:直接用在标签上,但维护成本高 style='font-size:16px;color:#000000' 2.外部连接式引用:css代码与html代码分离,便于代码重复使用 style. ...
P21-前端基础-CSS颜色四种表示方式
P21-前端基础-CSS颜色四种表示方式 1.概述颜色单位: 在CSS中可以直接使用颜色名来设置各种颜色比如:red.orange.yellow.blue.green - - 但是在css中直接使 ...
CSS的四种定位方式
CSS的四种定位方式 1.静态定位: 设置方式为position: static;静态定位的盒子是标准流状态,用于取消定位.静态定位的盒子处于网页的最底层,并且top.left.bottom.righ ...
CSS的三种样式：内联式，嵌入式，外部式以及他们的优先级
从CSS 样式代码插入的形式来看基本可以分为以下3种:内联式.嵌入式和外部式三种. 1:内联式css样式表就是把css代码直接写在现有的HTML标签中,如下面代码: <p style=" ...
分别写出引入CSS的3种方式, 特点, 优先级
第一:css的三种引入方式 1.行内样式最直接最简单的一种,直接对HTML标签使用style="",例如: <p style="color:#F00; " ...
【转载】HTML导入css的四种方式
原始链接在HTML中引2113入CSS的方法主要有四种5261,它们分别是行内式.内嵌式.链4102接式和导入式.1653 1.行内式行内式是在标记的style属性中设定CSS样式.这种方式没有体 ...
html中将scss转编译为css,SASS把scss转化为css的四种转化方式与命令
在终端输入命令: $ sass --watch scss:css --style expanded 即可实时把scss文件夹下的scss文件转化为css文件放入css文件夹中, 命令中使用的是expa ...

css的四种样式及其优先级

1.行内样式

代码

2.内嵌样式

代码

3.外链样式

代码

4.导入样式

5.四种样式的优先级

css的四种样式及其优先级相关推荐

最新文章

热门文章