如果元素具有某些类,是否可以在CSS中定义不应用样式? [英] Is it possible to define in CSS NOT to apply style if element have certain class?

查看:43
本文介绍了如果元素具有某些类,是否可以在CSS中定义不应用样式?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个应用程序,其中样式定义为

I have an application where styles are defined as

select { 
    border: 1px solid #6FA7D1; 
    outline:0; 
    height:25px; 
    padding-left: 5px; 
    font-family:Arial; 
    font-size:12px; 
    transition: all 0.8s; 
    border-bottom-left-radius: 5px; 
    border-top-left-radius: 5px; 
    }

因此,每个< select></select> 都将具有相同的样式,这是预期的,但是,我使用的是jqGrid之类的第三方插件,我不想在jqGrid传呼机中呈现的例如< select> 上应用相同的样式.此< select> 具有某些类.有什么方法可以告诉CSS不要使用某些类在DOM上应用?

so, every <select></select> will get the same style, which is expected, but, I'm using some third party plugins like jqGrid and I don't want to apply same style on for instance <select> rendered in jqGrid pager. This <select> has some class. Is there some way to tell in CSS not to apply on DOM with certain class?

请不要严格关注jqGrid中的< select> ,当我可以使用这种排除方式时,我会遇到更多的情况.

Please don't focus strictly on this <select> in jqGrid, I have more situations when I can use such exclusion.

推荐答案

您可以使用 :not 选择器可在某些情况下阻止应用程序,例如:

You can use the :not selector to prevent application under certain circumstances, e.g:

:不(选择器)选择

选择器与jQGrid id class

Where selector relates to either a jQGrid id or class

否定CSS伪类:not(X)是一种功能表示法以简单的选择器X作为参数.它匹配的元素不由参数表示.X不能包含另一个否定选择器.

The negation CSS pseudo-class, :not(X), is a functional notation taking a simple selector X as an argument. It matches an element that is not represented by the argument. X must not contain another negation selector.

这基本上是说目标选择元素,这些元素没有 selector 的子元素(在本例中为jQGrid)

This basically says target select elements which arent a child of selector (in this case jQGrid)

您可以使用:not 排除匹配元素的任何子集.

You can use :not to exclude any subset of matched elements.

:not(div) > span {
  color: red;
}

<span>Make me red!</span>
<div><span>...but not me...</span>
</div>

这篇关于如果元素具有某些类,是否可以在CSS中定义不应用样式?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆