通过在CSS属性后面跟上!important参数,就会让该属性的优先级变为最高,不管是在css文件,还是内联style中,就属后面跟了!important这个小弟的属性的优先级最高。

让我们来测试一下,例如

<html>
<head>
<style>
.main{color:blue !important;}
</style>
</head>
<body>
<div class="main" style="color:red;">
猜一猜,这些字体是蓝色,还是红色?
</div>
</body>
</html>

如果main类样式的color属性后面没有跟!important,那么按照优先级来说,下面的这些字的颜色会变成红色,但是,总有但是!请看下面的运行结果:

结果是蓝色的!

每天CSS学习之!important的更多相关文章

  1. CSS学习笔记

    CSS学习笔记 2016年12月15日整理 CSS基础 Chapter1 在console输入escape("宋体") ENTER 就会出现unicode编码 显示"%u ...

  2. css学习归纳总结(一) 转

    原文地址:CSS学习归纳总结(一) 选择器的分组 CSS选择器分为 1.群组选择器 如:p, body, img, div{} 2.兄弟选择器 如:p + p { color:#f00; } 3.属性 ...

  3. css学习归纳总结

    来源于:trigkit4 css学习归纳总结(一) 选择器的分组 CSS选择器分为 1.群组选择器 如:p, body, img, div{} 2.兄弟选择器 如:p + p { color:#f00 ...

  4. CSS学习摘要-定位实例

    CSS学习摘要-定位实例 注:全文摘自MDN-CSS定位实例 列表消息盒子 我们研究的第一个例子是一个经典的选项卡消息框,你想用一块小区域包括大量信息时,一个非常常用的特征.这包括含有大信息量的应用, ...

  5. CSS学习笔记之选择器

    目录 1.元素选择器 2.继承 3.选择器分组 4.声明分组 5.后代选择器 6.子元素选择器 7.相邻兄弟选择器 8.类选择器 9.ID 选择器 10.属性选择器 11.伪类 12.伪元素 1.元素 ...

  6. HTML与CSS学习记录

    title: HTML与CSS学习记录 toc: true date: 2018-09-10 14:04:59 <HTML与CSS进阶教程读书笔记> HTML基础知识 HTML与XHTML ...

  7. CSS 学习手册

    目录 CSS 简介 1.CSS 简介 CSS 概述 层叠次序 2.CSS 基础语法 CSS 语法 值的不同写法和单位 记得写引号 多重声明: 空格和大小写 3.CSS 高级语法 选择器的分组 继承及其 ...

  8. 47.前端css学习、登陆页面的制作

    CSS: 有了CSS,html中大部分表现样式的标签就可以不用了 html只负责文档的结构和内容,表现形式完全交给CSS,html文档变得更加简洁 CSS的引入方式: 内联式引入:直接赋予标签styl ...

  9. CSS学习之选择器优先级与属性继承

    CSS学习之选择器优先级与属性继承 选择器优先级 其实选择器是具有优先级的,我们来看下面这一组案例: <!DOCTYPE html> <html lang="en" ...

随机推荐

  1. HeadFIrst Ruby 第六章总结 block return values

    前言 这一章通过抽取一个文件中的确定的单词的项目进行讲解,主要包括了: File 的打开.阅读与关闭 find_all & refuse方法的相关内容 map 方法的相关内容这章的核心是:关于 ...

  2. 如何在mmseg3添加词库

      一.了解几个文件 ll /usr/local/mmseg/etc/mmseg.ini uni.lib 编译后的词库,给sphinx 用的unigram.txt 原词库给人看的, 在这里面人工添加自 ...

  3. CentOS7 下源代码安装mysql5.6

    ###### mysql ######### 引言:这里选用mysql5.6版本,5.7版本编译时间需要几个小时. 编译安装环境: yum -y install make gcc-c++ cmake ...

  4. github入门书籍总结

    目录 第一章 由来 第二章 基本知识简介 第三章 初始操作 3.1 注册账号 3.2 创建仓库 第四章 具体实际操作 4.1 初始化仓库及相关操作 4.2 分支操作 4.3 消除冲突 4.4 压缩历史 ...

  5. grid 用于同一用例在不同测试环境下的测试结果

    步骤: 1.http://www.seleniumhp.org/download   下载selenium standalone server 2.配置java环境 3.运行selenium serv ...

  6. jquery快速获得url 的get传值

    <script> var res = location.search.substr(1).split("&"); var arr={}; for (var i ...

  7. python基础之小数据池,is和==区别 编码问题

    主要内容 小数据池,is和==区别 编码问题 小数据池 一种缓存机制,也称为驻留机制,是为了能更快提高一些字符串和整数的处理速度is 和 == 的区别 == 主要指对变量值是否相等的判断,只要数值相同 ...

  8. Hongcow Buys a Deck of Cards CodeForces - 744C (状压)

    大意: n个红黑卡, 每天可以选择领取一块红币一块黑币, 或者买一张卡, 第$i$张卡的花费红币数$max(r_i-A,0)$, 花费黑币数$max(b_i-B,0)$, A为当前红卡数, B为当前黑 ...

  9. 百度基础架构组-实习生面试(2016.08 java后台开发)

    一.项目 1.Spring MVC与Struts2的区别: 2.MVC三层是如何工作的?比如:要访问一个Url?a=xx&b=xx,怎么找到相应的资源,怎么运算,怎么返回等? 3.数据库myb ...

  10. 5月13 jquery的一些应用

    首先对于JavaScript的一些复习:操作内容,操作属性,操作样式 <title>无标题文档</title> <style> #aa { width:200px; ...