css - 更改 Bootstrap 列表组项的 'thickness'

Question

我想减少列表组元素的厚度，同时保持标题文本合适。

<ul class="list-group"> 
  <a href="#id" class="list-group-item list-group-item-info" data-toggle="collapse">Title</a>
</ul>

.list-group-item {
  height: 10px;
}

这成功地减少了厚度，但标题文本仍然太大。我怀疑高度属性使用不当？

Answer 1

大小由这个类控制

.list-group-item {
    position: relative;
    display: block;
    padding: 0px 15px; /* adjust here */
    margin-bottom: -1px;
    border: 1px solid #ddd;
    line-height: 1em /* set to text height */
}

Codepen Demo