我们在做网页代码的时，有些特殊的情况需要为某些样式设置具有最高权值，怎么办？这时候我们可以使用!important来解决。

如下代码：

p{color:red!important;}

p{color:green;}

<p class="first">三年级时，我还是一个<span>胆小如鼠</span>的小女孩。</p>

这时 p 段落中的文本会显示的red红色。

注意：!important要写在分号的前面

这里注意当网页制作者不设置css样式时，浏览器会按照自己的一套样式来显示网页。并且用户也可以在浏览器中设置自己习惯的样式，比如有的用户习惯把字号设置为大一些，使其查看网页的文本更加清楚。

这时注意样式优先级为：浏览器默认的样式 < 网页制作者样式 < 用户自己设置的样式，但记住!important优先级样式是个例外，权值高于用户自己设置的样式。

示例:

<!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>!important</title>

<style type="text/css">

p{color:red!important;}

p.first{color:green;}

</style>

</head>

<body>

    <h1>勇气</h1>

    <p class="first">三年级时，我还是一个<span>胆小如鼠</span>的小女孩，上课从来不敢回答老师提出的问题，生怕回答错了老师会批评我。就一直没有这个勇气来回答老师提出的问题。学校举办的活动我也没勇气参加。</p>

    <p id="second">到了三年级下学期时，我们班上了一节公开课，老师提出了一个很<span class="first">简单</span>的问题，班里很多同学都举手了，甚至成绩比我差很多的，也举手了，还说着："我来，我来。"我环顾了四周，就我没有举手。</p>

</body>

</html>

效果:

一片红彤彤~~不截图了~

重要性!important的更多相关文章

  1. CSS规则的执行顺序（转）

    你对CSS规则的执行顺序是否了解,这里和大家分享一下,若两条规则具有相同的权值.起源及特殊性,那在样式表中最后出现的规则优先. 1.CSS规则之特殊性 首先来看一下这个例子将会发生的情形: <s ...

  2. 学习笔记：HTML+CSS 基础知识

    1.<q>标签,短文本引用       <q>引用文本</q> <q>标签的真正关键点不是它的默认样式双引号(如果这样我们不如自己在键盘上输入双引号就行 ...

  3. 从零开始学习html（九）CSS的继承、层叠和特殊性

    一.继承 <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" co ...

  4. CET4词汇

    abandon vt.丢弃:放弃,抛弃 ability n.能力:能耐,本领 abnormal a.不正常的:变态的 aboard ad.在船(车)上:上船 abroad ad.(在)国外:到处 ab ...

  5. 浅淡!important对CSS的重要性

    SS中的!important是一个非常重要的属性,有时候发挥着非常大的作用,52CSS.com这方面的知识并不是非常多,我们看下面的文章,对它作比较感观的了解. 前几天写一些CSS代码的时候又难为我了 ...

  6. kaggle数据挖掘竞赛初步--Titanic<随机森林&特征重要性>

    完整代码: https://github.com/cindycindyhi/kaggle-Titanic 特征工程系列: Titanic系列之原始数据分析和数据处理 Titanic系列之数据变换 Ti ...

  7. CSS中继承，特殊性，层叠与重要性

    继承 CSS的某些样式是具有继承性的,那么什么是继承呢?继承是一种规则,它允许样式不仅应用于某个特定html标签元素,而且应用于其后代.比如下面代码: <html><head> ...

  8. CSS选择器特殊性与重要性

    特殊性 在编写CSS代码的时候,我们会出现多个样式规则作用于同一个元素的情况,例如 <!-- HTML --> <header> <nav class="nav ...

  9. !important css样式

    重要性 我们在做网页代码的时,有些特殊的情况需要为某些样式设置具有最高权值,怎么办?这时候我们可以使用!important来解决. 如下代码: p{color:red!important;} p{co ...

随机推荐

  1. C - Point on Spira

      Time Limit:2000MS     Memory Limit:262144KB     64bit IO Format:%I64d & %I64u Submit Status Pr ...

  2. bzoj3261

    xor有一个很重要的性质就是A xor B xor B=A所以这道题求[l,r]中p,使a[p] xor a[p+1] xor ... xor a[N] xor x 最大就是=最大化a[1] xor ...

  3. Linux Kernel TUNSETIFF释放后重用本地拒绝服务漏洞(CVE-2013-4343)

    漏洞版本: Linux kernel <= 3.11 漏洞描述: BUGTRAQ ID: 62360 CVE(CAN) ID: CVE-2013-4343 Linux Kernel是Linux操 ...

  4. Google Map API 学习五

    今天其实收货很大的 1.InfoWindow google.maps.InfoWindow class An overlay that looks like a bubble and is often ...

  5. POI做题记录：第二届POI

    Trees Memory limit: 32 MB Trees occur very often in computer science. As opposed to trees in nature, ...

  6. 如何配置jdk和tomcat 转

    一.配置JDK1.解压JDK至D:\JDK1.5目录下(楼主可以自由选取目录).2.设置环境变量(右键我得电脑->属性->高级->环境变量),在系统变量中添加一个叫JAVA_HOME ...

  7. Codevs 3304 水果姐逛水果街Ⅰ 线段树

    题目: http://codevs.cn/problem/3304/   时间限制: 2 s   空间限制: 256000 KB   题目等级 : 钻石 Diamond 题解       题目描述 D ...

  8. jQuery各种效果举例

    jQuery 所有jQuery详细使用说明请见:http://www.php100.com/manual/jquery/ jQuery的作用是操作浏览器html,从而达到用户的可视化效果,按照功能可分 ...

  9. Google改变生活

    前言 前天,在图书馆,无意之中,发现这本书,特写博客来与各位前来下榻本园的博友们,分享和学习!  本博文的主要内容有: 参考此书.感谢韩梅编者,出于此,我写本博文为了方便日后自己的查阅使用和来我园的共 ...

  10. 查看线程linux cpu使用率

    Linux下如何查看高CPU占用率线程 LINUX CPU利用率计算 转 http://www.cnblogs.com/lidabo/p/4738113.html目录(?)[-] proc文件系统 p ...