css原理：1.优先原则=>后解析的内容会覆盖之前解析的内容（所谓解析就是读取的css样式）2.继承原则=>嵌套里面的标签拥有外部标签的某些样式，子元素可以继承父元素的属性

1》优先原则针对选择器：a.同一个选择器从上往下读取执行css样式 b.同一类选择器从上往下执行 c.不同类型的选择器优先级，先执行低优先级再执行高优先级，比方基本选择器就是从*通配符<标签div<class选择器<id选择器 d.外部样式与内部样式合并之后再一起执行，根据从上往下执行顺序读取 e.内联样式也就是行内样式是最后执行的 f.加了！important字段是最后执行的

2》继承原则：2.1跟文字样式相关的可以被继承/其他的不能继承 2.2块级元素的宽度如果不设置会继承父元素的宽度，高度取决于它的内容

 <!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <meta name="viewport" content="width=device-width, initial-scale=1.0">

     <title>css的核心原理分为优先级原则与继承原则两大部分</title>

     <!-- 优先原则针对选择器：a.同一个选择器从上往下读取执行css样式

         b.同一类选择器从上往下执行 c.不同类型的选择器优先级，先执行低优先级再执行高优先级，比方基本选择器就是从*通配符<标签div<class选择器<id选择器

         d.外部样式与内部样式合并之后再一起执行，根据从上往下执行顺序读取 e.内联样式也就是行内样式是最后执行的 f.加了！important字段是最后执行的 -->

     <style type="text/css">

     div{

         /* color:#f90; */

         color:#f90 !important;

     }

     /* div{

         color:red;

     }

     .box1{

         color: yellowgreen;

     }

     #box2{

         color: violet;

     } */

     </style>

     <link rel="stylesheet" href="demo2.css"><!--新建demo2.css,文件内容div{color: blue;}-->

 </head>

 <body>

     <!-- <div class="box1" id="box2">我想起那天下午在夕阳下的奔跑,那是我逝去的青春</div> -->

     <div style="color: skyblue;">我想起那天下午在夕阳下的奔跑,那是我逝去的青春</div>

 </body>

 </html>

css的核心原理分为优先级原则与继承原则两大部分的更多相关文章

  1. CSS核心原理

    1.优先原则: 后解析的内容,会覆盖掉之前解析的内容: 同一个选择器:文件执行从上往下,后面的样式会覆盖前面的: 如下例中color最终为粉色: div { color:red; color:pink ...

  2. Spring核心原理分析之MVC九大组件（1）

    本文节选自<Spring 5核心原理> 1 什么是Spring MVC Spring MVC 是 Spring 提供的一个基于 MVC 设计模式的轻量级 Web 开发框架,本质上相当于 S ...

  3. Maven 核心原理

    Maven 核心原理 标签 : Java基础 Maven 是每一位Java工程师每天都会接触的工具, 但据我所知其实很多人对Maven理解的并不深, 只把它当做一个依赖管理工具(下载依赖.打包), M ...

  4. hadoop系列：zookeeper（2）——zookeeper核心原理（选举）

    1.前述 上篇文章<hadoop系列:zookeeper(1)--zookeeper单点和集群安装>(http://blog.csdn.net/yinwenjie/article/deta ...

  5. CSS的核心属性和浮动

    1.CSS属性组成和作用   属性:属性值 1)每个css样式都必须由两部分组成:选择符(Selector)和声明(Decleration) 注:声明又包括属性(Properyt)和属性值(Value ...

  6. SPA 路由三部曲之核心原理

    为了配合单页面 Web 应用快速发展的节奏,近几年,各类前端组件化技术栈层出不穷.通过不断的版本迭代 React.Vue 脱颖而出,成为当下最受欢迎的两大技术栈. 仅 7 个月的时间,两个技术栈的下载 ...

  7. Java Reference核心原理分析

    本文转载自Java Reference核心原理分析 导语 带着问题,看源码针对性会更强一点.印象会更深刻.并且效果也会更好.所以我先卖个关子,提两个问题(没准下次跳槽时就被问到). 我们可以用Byte ...

  8. CSS三种写法的优先级

    在HTML文件中引入CSS样式有三种方法: 外部样式:通过link标签引入CSS样式: 内页样式:写在HTML页面里面的style标签里面: 行内样式:写在对应标签的style属性里面. 我知道一般情 ...

  9. HDFS 核心原理

    HDFS 核心原理 2016-01-11 杜亦舒 HDFS(Hadoop Distribute File System)是一个分布式文件系统文件系统是操作系统提供的磁盘空间管理服务,只需要我们指定把文 ...

随机推荐

  1. [集训]Trominoes，钩子公式运用

    题意 用这四种骨牌密铺n*m的正方形矩阵,可以不选,求方案数.n*m<=1E8.多组询问. 思考 用如上的表达难以进行计算,尝试转化为一种新的组合解释. 若从右上角开始填起,我们强制要求里面的轮 ...

  2. redis--->微博小项目

    redis 微博小项目 centos6.9+lnmp+redis 写的微博小项目,梳理了redis在项目中kes的设计,redis各种数据结构在不同业务场景下的应用等知识点. 这里用的php框架是自己 ...

  3. Maven的scope属性作用域范围

    在POM 4中,<dependency>中还引入了<scope>,它主要管理依赖的部署.目前<scope>可以使用5个值: 1. compile,缺省值,适用于所有 ...

  4. sublime sftp插件安装及时更新网站

    Sublime Text 2 本身并不强大,但是它方便使用插件扩展功能,所以变得很强大.今天介绍一个很实用的插件 SFTP ,可以大大提高前端工作效率. 常见的工作流程 有时候修改一些网站上的文件,通 ...

  5. kdevelop 是什么 什么鬼(windows系统非linux)

    这个软件尼玛 有懂的没,编译执行 1.需要gcc 2.需要啥怎么配置尼玛 3........................... 4.疯了都 大家懂得来说说

  6. Gradle | Gradle项目无法导入依赖包

    Gradle | Gradle项目无法导入依赖包 背景 今天使用idea导入一个Gradle项目,使用 gradle build构建成功,但是项目还是无法正常导入依赖包,显示错误如下: 解决方案 后来 ...

  7. 暑假第七周总结（安装MongoDB和Tomcat以及MongoDB进行编程实践）

    本周主要对MongoDB和Tomcat进行了安装,两项安装都遇到了一些问题.其中在对MongoDB安装过程中出现了什么没有秘钥安全证书的,最终找了一堆教程重复了好多遍之后安装成功,虽然在启动和关闭的时 ...

  8. 快乐编程大本营【java语言训练班】第5课: java的数组编程

    快乐编程大本营[java语言训练班]第5课: java的数组编程 第1节. 声明数组变量 第2节. 创建数组对象 第3节. 访问数组元素 第4节. 修改数组元素 第5节. 多维数组 学习地址如下:ht ...

  9. 16、ISDN

    ISDN:综合业务数据网 分类:1.宽带ISDN:基本上被淘汰2.窄带ISDN:用于备份链路,速率比较低 ISDN的起源和优点 ISDN能够提供声音.视频.数据等传输业务 ISDN的两种服务方式ISD ...

  10. Spring（六）核心容器 - 注册单例 Bean 实例、SingletonBeanRegistry 简介

    前言 上篇文章我们对注册 Bean 的核心类 BeanDefinitionRegistry 进行了讨论,这里的注册 Bean 是指保存 Bean 的相关信息,也就是将 Bean 定义成 BeanDef ...