第一：css的四种引入方式

1.行内样式

最直接最简单的一种，直接对HTML标签使用style=""，例如：

<p style="color:#F00; "></p>

缺点：HTML页面不纯净，文件体积大，不利于蜘蛛爬行，后期维护不方便。

2.内嵌样式

内嵌样式就是将CSS代码写在<head></head>之间，并且用<style></style>进行声明，例如：

<style type="text/css">

body,div,a,img,p{margin:0; padding:0;}

</style>

优缺点：页面使用公共CSS代码，也是每个页面都要定义的，如果一个网站有很多页面，每个文件都会变大，后期维护难度也大，如果文件很少，CSS代码也不多，这种样式还是很不错的。

3.链接样式

链接样式是使用频率最高，最实用的样式，只需要在<head></head>之间加上<link…/>就可以了，如下：

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

优缺点：实现了页面框架代码与表现CSS代码的完全分离，使得前期制作和后期维护都十分方便

4.导入样式（不建议使用）

导入样式和链接样式比较相似，采用@import样式导入CSS样式表，在HTML初始化时，会被导入到HTML或者CSS文件中，成为文件的一部分，类似第二种内嵌样式。

@import在html中使用，如下：

<style type="text/css">
@import url(style.css);
</style>

@import在CSS中使用，如下：

@import url(style.css);

第二：四种CSS引入方式的优先级

1.就近原则

2.理论上：行内>内嵌>链接>导入

3.实际上：内嵌、链接、导入在同一个文件头部，谁离相应的代码近，谁的优先级高

CSS的4种引入方式及优先级的更多相关文章

  1. {前端CSS} 语法 Css的几种引入方式 css选择器 选择器的优先级 CSS属性相关 背景属性 边框 CSS盒子模型 清除浮动 overflow溢出属性　　定位（position）z-index

    前端CSS CSS介绍 CSS(Cascading Style Sheet,层叠样式表)定义如何显示HTML元素,给HTML设置样式,让它更加美观. 当浏览器读到一个样式表,它就会按照这个样式表来对文 ...

  2. html(常用标签,标签分类)，页面模板， CSS(css的三种引入方式)，三种引入方式优先级

    HTML 标记语言为非编程语言负责完成页面的结构 组成: 标签:被<>包裹的由字母开头,可以结合合法字符( -|数字 ),能被浏览器解析的特殊符号,标签有头有尾 指令:被<>包 ...

  3. css-1,css的三种引入方式 基本选择器

    <!-- (1)CSS 层叠样式表 作用:修饰网页结构 (2)css的三种引入方式 权重: 优先级高 权重大 谁在页面谁的权重大 - 行内样式 注意:行内样式的优先级是最高的 - 内接样式 - ...

  4. 11 CSS的三种引入方式和基本选择器

    <!-- 整体说明: 1.CSS的三种引入方式 (1)行内样式 (2)内接样式 (3)外接样式 2.CSS的基本选择器 (1)id选择器 (引用方式:#id) (2)标签选择器(引用方式:标签名 ...

  5. 2016/2/24 1,css有几种引入方式 2,div除了可以声明id来控制，还可以声明什么控制？ 3,如何让2个div，并排显示。4，清除浮动 clear：left / right / both

    1,css有几种引入方式 使用HTML标签的STYLE属性 将STYLE属性直接加在单个的HTML元素标签上,控制HTML标签的表现样式.这种引入CSS的方式是分散灵活方便,但缺乏整体性和规划性,不利 ...

  6. 《网页设计基础——CSS的四种引入方式详解》

    网页设计基础--CSS的四种引入方式详解     一.行内式:   规则: 1. 行内式是所有样式方法中最为直接的一种,它直接对HTML的标记使用style属性,然后将CSS代码直接写在其中.   格 ...

  7. Python 45 css三种引入方式以及优先级

    一:css三种引入方式 三种方式为:行间式 | 内联式 | 外联式 行间式   1.在标签头部的style属性内  2.属性值满足的是css语法  3.属性值用key:value形式赋值,value具 ...

  8. 页面中CSS的四种引入方式的介绍与比较

    转自:https://blog.csdn.net/qq_38689666/article/details/79039392 一:行内式 <p style="color:red" ...

  9. CSS三：CSS的三种引入方式

    CSS的引入方式共有三种:行内样式.内部样式表.外部样式表. 一.行内样式 使用style属性引入CSS样式. 示例:<h1 style="color:red;">st ...

随机推荐

  1. STL中的next_permutation

    给定一个数组a[N],求下一个数组. 2 1 3 4 2 1 4 3 2 3 1 4 2 3 4 1 ..... 在STL中就有这个函数: 1.参数是(数组的第一个元素,数组的末尾),注意这是前闭后开 ...

  2. 6.7-3将数组arr中索引值为2的元素替换为“bb”

    package shuzu; import java.util.Arrays; public class TH { public static void main(String[] args) { / ...

  3. Struts2 Action扩展名的三种修改方法

    最近在做项目开发过程中犯了一个很低级的错误,在这里列举出来,供大家参考借鉴:我希望通过Url请求一个Action,最终通过服务器的处理能得到一个Json串,所以我在Url中体现这一特点,将action ...

  4. poj1417 带权并查集 + 背包 + 记录路径

    True Liars Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 2713   Accepted: 868 Descrip ...

  5. 【USACO 2.2】Runaround Numbers

    找出第一个大于n的数满足:每一位上的数都不同,且没有0,第一位开始每次前进当前这位上的数那么多位,超过总位数就回到开头继续往前进,最后能不能每个位都到过一次且回到第一位,$n<10^9$. 暴力 ...

  6. Linux基础2

    命令格式命令的类型:1.内部命令 linux系统使用的shell提供.2.外部命令 安装第三方软件才会. type 命令名 查命令的类型 | 把前边命令的输出作为后边命令的输入 管道 grep 对数据 ...

  7. Xcode 的ARC转化功能以及跟非ARC共存方法

    1.ARC工程跟非ARC文件的共存方法: 在工程中选择 Build Phases 然后选择Compile Sources 里面,找到需要共存的非ARC文件,然后按Enter键,在弹出的窗口中填入:-f ...

  8. ORA-29538、ORA-29532、ORA-29913问题解决

    问题一:ERROR at line 1: ORA-29538: Java not installed解决方法1.检查有没有安装JAVA组件select * from v$option t where ...

  9. 【BZOJ-3931】网络吞吐量 最短路 + 最大流

    3931: [CQOI2015]网络吞吐量 Time Limit: 10 Sec  Memory Limit: 512 MBSubmit: 1228  Solved: 524[Submit][Stat ...

  10. 在网页上添加QQ消息代码

    进入:http://shang.qq.com/v3/widget.html 复制代码 到网页