是否可以使用CSS覆蓋CSS背景位置的一個軸？

Question

我正在使用CSS sprites來構建一個六選項卡菜單。由於選項卡重疊，我決定在精靈中使用六個版本的圖像，每個活動選項卡狀態一個（一個在另一個下面）。所以我需要爲每個狀態改變多個選項卡，因爲相鄰的重疊部分，所以我不妨改變它們全部的位置。

在菜單中，菜單中的每個鏈接都有自己的CSS背景，從精靈圖像定義。它很好地融合在一起。

我希望做的是添加一個類，將改變所有的鏈接背景的垂直位置，而不必定義水平，這樣的水平位置是可以繼承的身體。這樣我只需要定義六個類來讓它工作，而不是每個狀態中的六個（= 36）。

一些相當於background-position:inherit -94px。

我可以用jQuery輕鬆實現，但希望獲得僅限CSS的解決方案。

Answer 1

不，不能這樣做。主要是因爲firefox不支持background-position-x和background-position-y雖然可以理解，因爲它不是規範的一部分。

我不久前就遇到了這個問題，但簡短的調查告訴我這仍然是不可能的。

我打算假設你有一個你想用於多種菜單狀態的精靈。在這種情況下，你應該只將2分爲精靈，一個用於狀態a，另一個用於狀態b，當你添加類時，你只需切換到圖像b background-image。

這是一個更多的圖像，但實際上沒有一個交叉瀏覽器的方式來移動一個軸。