Point one style class to another?

匿名 (未验证) 提交于 2019-12-03 02:50:02

问题:

I have a css class like:

.foo {   background-color: red; } 

then I have a class specified for a list:

.list1 li {   background-color: tan; } 

is it possible to set one style class to just point to another? Something like:

.list1 li {   .foo; } 

not sure how to articulate that - I just want the .list li style to be whatever I define for the .foo class.

Thanks

回答1:

You can use selector grouping:

.foo, .list1 li {    background-color: red;  }  


回答2:

No. The best you can do with "native CSS" is to use a multiple selector:

.foo, .list1 li {    ... } 

Otherwise there are preprocessors that can help with this such as SASS.



回答3:

Not with any syntax like that (and don't confuse a "class" (an HTML term) with a "class selector" or a "rule-set").

Your options are multiple classes, grouping selectors or preprocessing.



回答4:

You might want to look into a CSS preprocessor such as SASS or LESS. You can define variables that can be used throughout your code. It greatly speeds up your coding when you're familiar with it.

http://sass-lang.com/

http://lesscss.org/

Using SASS:

$darkred : #841c14; .box {      background: $darkred; } 


回答5:

Afaik, this isn't possible (yet) I hope it will be in the future. I always just copy+paste whatever I want to be the same into the desired selector or put the selector names one after another:

.foo, .li, .whatever {styles} 

Maybe someone else has another suggestion.



回答6:

Inheritance is, as far as I know, not supported in CSS (2.1 at least)



回答7:

No you can't but you override it using naming differnt classes for example

.foo { background-color: red; }

.list1 li { background-color: tan; }

class ="list1 foo" 


回答8:

to help clarify what is meant by overriding, if you want .list1 li to carry all the styles of foo, but just want to change it's color to tan, i would do this:

<span class = "foo">   <span class = "list1"><!--or whatever name you have for your new style-->     TEXT WITH INHERITED STYLE GOES HERE   </span> </span> 


标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!