javascript - 如何使类内部 ul li css

Question

下面的css样式是这样的:

ul {         
    padding:0 0 0 0;
    margin:0 0 0 0;
}
#foo li {     
   list-style:none;
   margin-bottom:25px;           
}
ul li img {
   cursor: pointer;
}

ul li 包括:

<ul id="foo" class="row">
  <li class="col-lg-3 col-md-3 ">
  <img class="img-responsive" src="images/photodune-174908-rocking-the-night-away-xs.jpg">
  </li>
</ul>

是否可以将 #ul 从 id 更改为 class ？我试过这样:

ul {         
  padding:0 0 0 0;
  margin:0 0 0 0;
}
li.bar {     
  list-style:none;
  margin-bottom:25px;           
}
ul li img {
  cursor: pointer;
}

<ul id="" class="row bar">
  <li class="col-lg-3 col-md-3 ">
    <img class="img-responsive" src="images/photodune-174908-rocking-the-night-away-xs.jpg">
  </li>
</ul>

它可以工作，但有一些问题我认为它不能正常工作。

Answer 1

由于您的 li 标签没有 .bar 类，所以它无法工作。

如果你想设置 li 的样式，将 css 更改为:

.bar li {
    list-style:none;
    margin-bottom:25px; 
}

或

如果你想设置 ul 的样式，将 css 更改为:

ul.bar {
    list-style:none;
    margin-bottom:25px;
}

使用您的 css 代码，您可以使用 .bar 类设置 li 标签的样式。