CSS样式继承/重载

Question

我有一个网页,在某一点上,显示一个导航栏,它只不过是一个元素的列表(ul).大多数的风格规则说一个元素是常见的.应该更改的唯一部分是要显示的图像,可以从列表的每个li元素的id标记中猜出.

所以这就是问题:

是否有CSS的方式来定义一个类似"基地"的风格为所有的一个元素,然后根据ID集合的形象呢？也许不是(CSS控件继承 - 继承其他控件样式),但我想确定.

我试过了:

#nav li a {
    /*This would be the 'base' For all the "a"s inside a 
      list inside an element with id=nav (nav -> navigation)*/
 background-color: transparent;
 background-repeat: no-repeat;
 background-position: 0 -58px;
 border-left: thin #444444 solid;
}


#nav li#settings a {
 background: url(../images/nav_settings.png);
}

#nav li#media a {
 background: url(../images/nav_media.png);
}

#nav li#user a {
 background: url(../images/nav_admin.png);
}

但它似乎不起作用......"基础"风格被覆盖......

先感谢您!

Answer 1

在您的特定情况下,请使用background-image CSS指令.使用背景时,您将重置所有先前设置的background-*属性.

像这样 - 示例:

#nav li#settings a {
 background-image: url(../images/nav_settings.png);
}

#nav li#media a {
 background-image: url(../images/nav_media.png);
}

#nav li#user a {
 background-image: url(../images/nav_admin.png);
}