是否可以创建一个从另一个CSS类(或多个)“继承”的CSS类。
例如,假设我们有:
.something { display:inline }
.else { background:red }
我想做的是:
.composite
{
.something;
.else
}
其中“.composite”类将显示为内联,并具有红色背景
是否可以创建一个从另一个CSS类(或多个)“继承”的CSS类。
例如,假设我们有:
.something { display:inline }
.else { background:red }
我想做的是:
.composite
{
.something;
.else
}
其中“.composite”类将显示为内联,并具有红色背景
当前回答
对于那些对上述(优秀)文章不满意的人,您可以使用编程技能创建一个变量(PHP或任何一个),并让它存储多个类名。
这是我能想出的最好的办法。
<style>
.red { color: red; }
.bold { font-weight: bold; }
</style>
<? define('DANGERTEXT','red bold'); ?>
然后将全局变量应用于所需的元素,而不是类名本身
<span class="<?=DANGERTEXT?>"> Le Champion est Ici </span>
其他回答
这在CSS中是不可能的。
CSS中唯一支持的是比另一条规则更具体:
span { display:inline }
span.myclass { background: red }
类为“myclass”的span将同时具有这两个财产。
另一种方法是指定两个类:
<div class="something else">...</div>
“else”的样式将覆盖(或添加)“something”的样式
完美的时机:我从这个问题转到了我的电子邮件,找到了一篇关于Less的文章,这是一个Ruby库,除其他外,它还做了以下工作:
由于super看起来就像页脚,但字体不同,所以我将使用Less的类包含技术(他们称之为mixin)来告诉它也包含这些声明:
#super {
#footer;
font-family: cursive;
}
CSS并没有真正做到你所要求的。若你们想在写规则的时候考虑到这个复合的想法,你们可能想看看指南针。这是一个样式表框架,看起来类似于前面提到的Less。
它让你做调酒和所有的好生意。
如果通过php对.css文件进行预处理,则可以实现所需的效果。...
$something='color:red;'
$else='display:inline;';
echo '.something {'. $something .'}';
echo '.else {'. $something .'}';
echo '.somethingelse {'. $something .$else '}';
...
将常用属性放在一起,然后再次指定特定(或覆盖)属性。
/* ------------------------------------------------------------------------------ */
/* Headings */
/* ------------------------------------------------------------------------------ */
h1, h2, h3, h4
{
font-family : myfind-bold;
color : #4C4C4C;
display:inline-block;
width:900px;
text-align:left;
background-image: linear-gradient(0, #F4F4F4, #FEFEFE);/* IE6 & IE7 */
}
h1
{
font-size : 300%;
padding : 45px 40px 45px 0px;
}
h2
{
font-size : 200%;
padding : 30px 25px 30px 0px;
}