0

私は<h1>次のようにスタイルを設定した を持っていますCSS:

#col2 h1 {
    text-align: left;
    padding: 2.5%;
    margin-top: 0;
    margin-bottom: 0;
    width: 95%;
    background-color: #444;
    border-bottom: solid 1px black;
    cursor: pointer;

    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

何らかの理由で、テキストは次のように表示されます。 <h1> のスクリーンショット

これは私が設定したことが原因である可能性があると最初に推測しましたmargin:0;が、変更すると2.5%、線間の距離は同じままで、暗い灰色の領域の上部にギャップが現れました.

4

2 に答える 2

4

次を指定しline-heightます。

h1 {
    line-height: 1.4em; /* or whatever... */
}

投稿された CSS にはこの問題を引き起こすものは何もないので、ブラウザーの開発者ツール (ほとんどのブラウザーで) を使用して、がどこから来ているか、またはどこからオーバーライドされているかF12を調べることをお勧めします。line-height

ちなみに、marginブロック レベル要素の は、要素によって形成される「ボックス」の外縁の周りに存在し、その要素内に含まれるテキストの行間の間隔には影響しません。

于 2013-10-07T18:36:40.603 に答える
1 
line-height:10px;

行の高さを増やしてみてください

于 2013-10-07T18:37:26.633 に答える