我有一個css類，比如:

.foo {
  background-color: red;
}

然后我為一個列表指定了一個類:

.list1 li {
  background-color: tan;
}

有沒有可能將一個樣式類設置為只指向另一個？類似于:

.list1 li {
  .foo;
}

不知道該如何表達-我只是想？我定義的李風格。foo類。

您可以使用選擇器分組:

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

不。對于“原生CSS ”,你能做的最好的事情就是使用多重選擇器:

.foo, .list1 li {
   ...
}

否則，有預處理程序可以幫助這一點，如SASS。

沒有任何類似的語法(不要混淆“類”(一個HTML術語)和“類選擇器”或“規則集”)。

您可以選擇多個類、分組選擇器或預處理。

你可能想看看CSS預處理程序，比如SASS或更少。您可以定義可在整個代碼中使用的變量。當你熟悉它時，它會大大加快你的編碼速度。

http://sass-lang.com/

http://lesscss.org/

使用SASS:

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

不，你不能，但是你可以用命名不同的類來覆蓋它

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

class ="list1 foo"

據我所知，CSS(至少2.1)不支持繼承

阿發克，這還不可能，我希望將來會。我總是復制+粘貼我想要的任何相同的內容到所需的選擇器中，或者將選擇器名稱一個接一個地放入:

.foo,
.li,
.whatever
{styles}

也許別人有別的建議。

如果你不能控制“foo”是如何定義的，上述解決方案就不可用。

因此，如果JQuery解決方案是可接受的，只需將原始類應用于新類/上下文的所有實例。在這種情況下:

$('.list li').addClass('foo')

為了幫助澄清什么是覆蓋，如果你想讓. list1 li包含foo的所有樣式，但只是想將它的顏色改為棕褐色，我會這樣做:

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

我有一個小小的擴展@Frank Carnovale解決方案(不改變css)。頁面加載后:

$(function () {
   $('.list li').removeClass('old1 old2 ...')
   $('.list li').toggleClass('foo1 foo2 ...')
}

另請參見JQuery中的addClass會覆蓋任何現有的基于css類的樣式嗎？

我也一樣在糾結。一切都是面向對象的，但CSS不是: 如果有3個容器(A/B/C)來定義邊框/背景/懸停屬性就太好了 并讓另外3個容器(X/Y/Z)定義文本屬性(顏色、字體、大小、粗細) 那你呢 如果你的HTML容器總是相同的話，你可以只給它們分配id或者類

現在你會定義 。E{ 。A 。Z } 。F{ 。B 。Z } 。G{ 。C 。Y }

為什么這是不可能的，而現在人們可以& quot管理& quot層次結構(層疊)是為什么如此多的頁面有成千上萬行CSS代碼的原因。 如果一個人可以& quot繼承& quotCSS定義中的其他id/類這可以大大減少。

人們可以簡單地在HTML和CSS中定義結構(布局)。

我在ServiceNow中發現的最糟糕的方法是: 他們使用CSS變量，元素沒有記錄，你需要自己弄清楚。每個元素有3個if...