1

タイトル テキストを適切に保ちながら、リスト グループ項目の厚みを減らしたいと考えています。

<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;
}

これにより、厚さは正常に減少しますが、タイトル テキストが大きすぎるままです。高さは使用するのに間違ったプロパティだと思いますか?

テキストが大きすぎる

4

3 に答える 3

2

サイズはこのクラスによって制御されます

.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 */
}

コードペンデモ

于 2015-09-08T10:18:30.237 に答える
1

liタグにはデフォルトのパディングがあります。それを達成するには、それをリセットする必要があります。テキストは、line-height彼のサイズに対して定義されています。line-heightas equal asを定義する必要がありますheight。

  li {
    padding:0;
    height: 10px;
    line-height: 10px;
  }
于 2015-09-08T10:18:48.487 に答える
0

代わりにこのようなパディングを使用しないでください..

ul a {
padding:10px; // give padding
height:auto;
}
于 2015-09-08T10:19:55.290 に答える