css规则可以放在云上,CSS中!important规则的使用方法

CSS中!important规则的使用方法

发布时间：2020-06-15 10:53:11

来源：亿速云

阅读：129

作者：Leah

这期内容当中小编将会给大家带来有关CSS中!important规则的使用方法，以专业的角度为大家分析和叙述，阅读完这篇文章希望大家可以有所收获。

!important规则是什么？怎么用？

!important是CSS的一个规则，用于提高指定CSS样式规则的应用优先权；它被添加到CSS值的末尾以赋予它更多权重。

在CSS中，样式规则以级联方式应用于元素。下面这个列表中越靠前的权重越小：

●　浏览器样式：是Web浏览器声明的默认样式。

●　用户声明的样式：是用户使用浏览器选项设置或通过开发人员调试工具修改的自定义样式。

●　开发中声明的样式：是网站开发人员在CSS样式表中声明的样式。

●　具有!important规则的开发者声明样式。

●　具有!important规则的用户样式。

!important规则的使用示例：

亿速云(php.cn)

#container{

width: 450px;

height: 200px;

font-size: 25px;

}

#example{

color:red !important;

}

#container #example{

color:pink;

}

亿速云！

效果图：

示例说明：

在这个例子中，我们首先有了一个包含！important规则的样式，定义一个元素(#example)的文本颜色为红色(red)。然后我们有有另一个样式来使这个元素(#example)的文本颜色变为粉色(pink)。由于！important声明，因此元素(#example)的文本颜色现在是红色而不是粉色。如果我们没有使用！important，那么颜色将是粉色的。

什么时候用!important规则？

除非绝对必要，否则不应使用!important规则；使用!important规则会打破了样式表的自然级联效果，使得代码难以维护。但是，在某些情况下你必须使用！important：

1、在测试和调试网站时，!important规则是非常有用的。

如果我们的代码中存在一些CSS问题，并且希望确保应用特定的样式，则可以使用!important规则在网站上临时修复问题，直到找到更好的方法(可能需要一些时间) 。

2、输出样式表

!important规则也可用于输出样式表，以确保应用样式而不被其他任何内容覆盖。

结论

使用!important对于性能并没有什么负面影响；但是从可维护性角度考虑，除非绝对必要，应尽可能的避免使用!important规则，它应该只在特殊情况下使用。

以上便是CSS中!important规则的使用方法，虽然从篇幅上看很复杂，但是示例代码非常详细且容易理解，如果想了解更多相关内容，请关注亿速云行业资讯。

css规则可以放在云上,CSS中!important规则的使用方法相关推荐

微信小程序云开发CMS中WebHook功能的使用方法
微信小程序云开发CMS中WebHook功能的使用方法官方文档 Webhook 是什么呢,翻译过来就是网页钩子.它的用处是,当我们在CMS进行增添查改的操作后,会自动回调webhook函数,我们就可以 ...
html+css基础仏学习教程之HTML 中播放声音或者视频的方法有很多种。
在 HTML 中播放声音或者视频的方法有很多种. HTML 音频问题,以及解决方法在 HTML 中播放音频并不容易! 您需要谙熟大量技巧,以确保您的音频文件在所有浏览器中(Internet Exp ...
junit测试起名字规则_如何在JUnit 5中替换规则
junit测试起名字规则最近发布的JUnit 5(又名JUnit Lambda) alpha发行版引起了我的兴趣,在浏览文档时,我注意到规则以及运行程序和类规则都消失了. 根据文档,这些部分竞争的概 ...
html多选框放在图片上,网页中图片格式问题地总结.doc
网页中图片格式问题地总结 HYPERLINK "file:///C:\\Users\\Administrator\\Desktop\\图片格式与设计那点事儿%20-%20TaobaoUED_ ...
矩池云上缺少cusparse.h头文件解决方法
1.检查系统版本 source /etc/os-release && echo $VERSION_ID 2.导入apt仓库和其GPG key # 第一步若输出 16.04 curl - ...
云上MongoDB常见索引问题及最优索引规则大全
本文干货较多,建议收藏学习.先将文章结构速览奉上: 一.背景二.MongoDB执行计划 2.1 queryPlanner信息 2.2 executionStats信息 2.3 allPlansExe ...
php 鼠标小手,CSS如何让鼠标放上时的小手样式
CSS实现让鼠标放上时出现小手样式的方法:首先创建一个HTML示例文件:然后在body中添加一个span标签:接着给该标签添加"cursor:pointer;"样式来实现让鼠标放上 ...
奉上一份云上数据安全保护指南
阿里云资深安全专家黄瑞瑞本方案的目标是为用户提供从底层云平台数据安全到上层的云上环境保护,并标明各层次模块,让用户可以像建房子一样,一层层的搭建可信的在云上数据的安全保护.在各横向层次模块之外,云上 ...
【三维深度学习】基于片元的渐进式三维点云上采样模型
点云上采样对于从稀疏三维数据重建稠密三维点云十分有效.但面对非规则.无需.稀疏.噪声和不完整的点云结构,图像领域的超分辨.补全.稀疏加密等方法无法直接用于点云上采样中.PointNet系列方法基于全连 ...

css规则可以放在云上,CSS中!important规则的使用方法

css规则可以放在云上,CSS中!important规则的使用方法相关推荐

最新文章

热门文章