我的编程空间,编程开发者的网络收藏夹
学习永远不晚

css如何强制增加优先级

短信预约 -IT技能 免费直播动态提醒
省份

北京

  • 北京
  • 上海
  • 天津
  • 重庆
  • 河北
  • 山东
  • 辽宁
  • 黑龙江
  • 吉林
  • 甘肃
  • 青海
  • 河南
  • 江苏
  • 湖北
  • 湖南
  • 江西
  • 浙江
  • 广东
  • 云南
  • 福建
  • 海南
  • 山西
  • 四川
  • 陕西
  • 贵州
  • 安徽
  • 广西
  • 内蒙
  • 西藏
  • 新疆
  • 宁夏
  • 兵团
手机号立即预约

请填写图片验证码后获取短信验证码

看不清楚,换张图片

免费获取短信验证码

css如何强制增加优先级

这篇文章主要介绍“css如何强制增加优先级”的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“css如何强制增加优先级”文章能帮助大家解决问题。

在css中,可以通过设置“!important”声明来强制增加优先级;该声明用于提高指定CSS样式规则的应用优先权,会被添加到CSS样式值的末尾以赋予该样式更多权重,语法“选择器{属性:值 !important;}”。使用“!important”规则会打破样式表的自然级联效果,使得代码难以维护;因此除非绝对必要,应尽可能避免使用!important规则,它应只在特殊情况下使用。

本教程操作环境:windows7系统、CSS3&&HTML5版、Dell G3电脑。

在css中,可以通过设置“!important”声明来强制增加优先级。

!important声明

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

选择器{属性:值 !important;}

注意:属性:值 !important 属性值用空格隔开即可。

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

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

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

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

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

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

!important为开发者提供了一个增加样式权重的方法,比直接在元素的 style 属性中设置 CSS 声明还要高, 一般用在 CSS 覆盖 JavaScript设置上。

示例:

<!DOCTYPE HTML>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>测试!Important</title>
</head>
<style type="text/css">
    #Box div
    {
        color: red;
    }
    .important_false
    {
        color: blue;
    }
    .important_true
    {
        color: blue !important;
    }
</style>
<body>
    <div id="Box">
        <div class="important_false">
            这一行末使用important</div>
        <div class="important_true">
            这一行使用了important</div>
    </div>
</body>
</html>

效果图:

css如何强制增加优先级

CSS代码第一行设定了box里面所有div中字体色为红色,第二行和第三行都用class重新定义了自身div的字体色为蓝色,

不同的是,第二行未使用!important,而第三行使用了!

总结:

第一行字体颜色是红色,可以证明,css样式设置中,id的优先级大于class,这行字还是红色。

第二行字体颜色是蓝色,可以证明,!important的优先级最高,important_true的css样式生效,这行字变为了蓝色!

什么时候用!important规则?

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

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

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

2、输出样式表

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

结论

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

以上就是本篇文章的全部内容,希望能对大家的学习有所帮助。更多精彩内容大家可以关注编程网相关教程栏目!!!

特别说明:

!important在IE6中是不被识别的,例:

.testClass{ 
    color:blue !important; 
    color:red;
}

这种写法在IE6下是识别不到的,.testCalss最后显示为红色,但也可以通过更改下写法让IE6识别到!important

.testClass{ 
    color:blue !important; 
} 
.testClass{ 
    color:red; 
}

关于“css如何强制增加优先级”的内容就介绍到这里了,感谢大家的阅读。如果想了解更多行业相关的知识,可以关注编程网行业资讯频道,小编每天都会为大家更新不同的知识点。

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

css如何强制增加优先级

下载Word文档到电脑,方便收藏和打印~

下载Word文档

猜你喜欢

如何使用css样式加载的优先级

这篇文章主要讲解了“如何使用css样式加载的优先级”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“如何使用css样式加载的优先级”吧!定义了class,在页面最初加载的过程中是被识别出来了,当
2023-06-08

如何创建强密码以增加CentOS系统安全级别

要创建强密码以增加CentOS系统的安全级别,可以遵循以下几个步骤:1. 长度:密码长度应该足够长,推荐至少12个字符以上。2. 复杂度:密码应该包含大小写字母、数字和特殊字符,例如大写字母(A-Z)、小写字母(a-z)、数字(0-9)和特
2023-10-10

html+css如何制作div标签增加右上角删除图标

这篇文章主要介绍html+css如何制作div标签增加右上角删除图标,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!一、需求描述在Div标签的右上角显示删除图标二、实现方式html、CSS三、参考代码