css-specificity

CSS precedence based on parent div

由 拈花ヽ惹草 提交于 2020-03-22 03:47:54
问题 If you view the following code in a browser the link appears red. I would expect it to be green because the secondary div is nested inside the primary div. It appears the color is determined by the order of the elements in the css file. If I move .secondary after .primary the link is green. <html lang="en" xmlns="http://www.w3.org/1999/xhtml"> <head> <meta charset="utf-8" /> <title></title> <style> .secondary a { color: green; } .primary a { color: red; } </style> </head> <body> <div class=

Which CSS pseudo-classes don't have specificity?

由 余生长醉 提交于 2020-02-02 02:30:25
问题 I'm studying a bit of CSS and from reading there are some pseudo-classes that don't have specificity like where() and not() . Are there more? 回答1: If you check the specification you can find the full detail of specificity calculation. I am going to refer to CSS selectors level 4 that include all the new selectors: A selector’s specificity is calculated for a given element as follows: count the number of ID selectors in the selector (= A) count the number of class selectors, attributes

Why do 'foo bar' and 'foo > bar' have the same specificity in CSS?

由 醉酒当歌 提交于 2020-01-09 19:54:27
问题 I'm curious why using > or other combinators does not affect the specificity of CSS selectors, i.e. why div span (matching a span somewhere inside a div) and div > span (matching a span which is the immediate child of a div) are considered equal regarding the specificity. I do realize that the usage of combinators is completely irrelevant for the specificity but I wonder if there's a certain reason for it. 回答1: This has actually been brought up in the working group mailing list, way back when

Why do 'foo bar' and 'foo > bar' have the same specificity in CSS?

由 守給你的承諾、 提交于 2020-01-09 19:53:54
问题 I'm curious why using > or other combinators does not affect the specificity of CSS selectors, i.e. why div span (matching a span somewhere inside a div) and div > span (matching a span which is the immediate child of a div) are considered equal regarding the specificity. I do realize that the usage of combinators is completely irrelevant for the specificity but I wonder if there's a certain reason for it. 回答1: This has actually been brought up in the working group mailing list, way back when

Programmatically set CSS selector specificity

由 对着背影说爱祢 提交于 2020-01-07 03:48:25
问题 Is it possible to set the specificity of a CSS selector, as opposed to it only being determined by counts of the selector(s) comprising it? i.e., if I have two selectors like so (showing the calculated specificity): UL OL LI /* a=0 b=0 c=3 -> specificity = 3 */ UL OL LI.red /* a=0 b=1 c=3 -> specificity = 13 */ (examples from https://www.w3.org/TR/selectors/#specificity) Is there any way to change the first example to this, in order to equalize the specificity of the two selectors and without

Calculating CSS selector specificity for :not() pseudo-class

由 大城市里の小女人 提交于 2020-01-06 04:38:04
问题 I already know how to calculate selector specificity for CSS (the a/b/c/d mentioned in specs). However, I am having trouble figuring how to calculate it for the :not() pseudo-class. See the following example: input:not([type="text"],[type="password"],.someClass) {...} input:not(#someId[type="text"]) {...} Assuming both of them apply to one element, should these two be calculated as (0011) and therefore they should be ordered according to order of appearance? Or should the selectors inside the

CSS Selector Hierarchy?

由 时光总嘲笑我的痴心妄想 提交于 2020-01-05 12:13:38
问题 I have two classes that I think are pointing to the same thing, but it doesn't appear so when using 'left.' When I edit 'left' for the ".side-menu" selector, nothing happens, but when I change the 'left' value for ".white-menu .side-menu", the left value changes. When I add a border using .side-menu, however, a border appears. What's going on? I searched here and Googled for info on descendant selectors and selector hierarchies but couldn't find anything. Thanks in advance!! <!DOCTYPE html>

CSS Selector Hierarchy?

由 生来就可爱ヽ(ⅴ＜●) 提交于 2020-01-05 12:11:23
问题 I have two classes that I think are pointing to the same thing, but it doesn't appear so when using 'left.' When I edit 'left' for the ".side-menu" selector, nothing happens, but when I change the 'left' value for ".white-menu .side-menu", the left value changes. When I add a border using .side-menu, however, a border appears. What's going on? I searched here and Googled for info on descendant selectors and selector hierarchies but couldn't find anything. Thanks in advance!! <!DOCTYPE html>

CSS Selector Hierarchy?

由 徘徊边缘 提交于 2020-01-05 12:11:16
问题 I have two classes that I think are pointing to the same thing, but it doesn't appear so when using 'left.' When I edit 'left' for the ".side-menu" selector, nothing happens, but when I change the 'left' value for ".white-menu .side-menu", the left value changes. When I add a border using .side-menu, however, a border appears. What's going on? I searched here and Googled for info on descendant selectors and selector hierarchies but couldn't find anything. Thanks in advance!! <!DOCTYPE html>

can an entire css “.class” have it's specificity as !important? [closed]

由 别等时光非礼了梦想. 提交于 2019-12-29 06:36:11
问题 It's difficult to tell what is being asked here. This question is ambiguous, vague, incomplete, overly broad, or rhetorical and cannot be reasonably answered in its current form. For help clarifying this question so that it can be reopened, visit the help center. Closed 6 years ago . I am working heavily in jQuery UI widgets and themeing is becoming hard because of an oversight that I need to work around. Consider this problem: <div id="node" class="ui-widget"> <div class="ui-widget-content">
订阅 css-specificity