Question

我有这样的事情：

    <ul class='yellow'>
      <li>item 1</li>
      <li>item 2</li>
      <li>item 3</li>
    <ul>

    <ul class='yellow'>
      <li>item 1</li>
      <li>item 2</li>
      <li>item 3</li>
    <ul>

我为ul设置了eatch li元素的背景。我认为最好的方法是使用ul {background: yellow}和li {background: inherit}。继承工作，但我不知道如何隐藏ul容器的背景...我试图使用display: inline或width: 0px解决它，并默认溢出，但它不起作用。

Answer 1

请勿设置<ul>的背景颜色。只为您<li>的孩子<ul class='yellow'>设置。

ul.yellow li{
  background-color: #ff0;
}

Answer 2

我这样解决：http://jsfiddle.net/nDVr6/3/

我不想使用ul.yellow li。

Answer 3

您可以直接将背景添加到li或者可以尝试显示：none到ul。设置父元素的宽度不起作用，因为它不会缩小小于子对象

css继承，隐藏根元素

3 个答案: