2016-10-03 7 views
0

バッファなしでline-heightを設定する簡単なCSSプロパティはありますか? css line-height cssプロパティは、行のテキストの上と下のスペースを制御するために使用できます。しかし、バッファを削除することは試行錯誤の問題であり、line-heightプロパティを使って調整することです。 CSSはこの試行錯誤なしにこのスペースを削除する簡単なプロパティをサポートしていますか?何かのように line-height-buffer:noneプロパティ?バッファなしでline-heightを設定する簡単なCSSプロパティはありますか?

+2

を書き込むことができますか? – Oriol

+0

バッファとは何ですか?あなたは詰め物を意味するのでしょうか? –

+0

あなたはスペースを意味しましたか?ちょうどラインハイト1? https://jsfiddle.net/f48guvnr/ – DaniP

答えて

0

line-heightをフォントのサイズ(たとえば16px)に設定すると、行の上下のスペースは、パディングやマージンによって発生する可能性があります。このような設定を使用すると、

p { 
    font-size: 14px; 
    line-height: 14px; 
    padding: 0; 
    margin: 0; 
} 

の間にスペースはありません。

しかし、唯一の特定の文字が行の完全な高さに達したことを覚えておいてください - 「g」はベースラインラインと混同しない)を下回る伸びはなく、アップ、「F」かもしれないが(使用しているフォントに依存しています。)

P.Sは:代わりに、フォントサイズの値を使用して、あなたはまた、あなたが「バッファ」とはどういう意味ですか

line-height: 100%; 
+0

フォントサイズは、typographyで使用されるem squareに対応しています。特定のグリフがemの四角の外に出るかもしれないことに注意してください。 – Oriol

+0

私は2つのアプローチを試みましたが、いくつかのピクセルがまだページ上のテキストの上と下に表示されます:https://jsbin.com/bewemi/edit?html,css。私はここに何かを逃していますか – user6867266

+0

ここで使用した「コンテンツ」という単語には、ベースラインを下回る文字は含まれていません。たとえば、 "g"を追加してみてください。背景色を追加すると、よりよく表示されます。デモンストレーションのためにあなたの例を変更しました:https://jsbin.com/vuwuyowowa/1/edit?html,css,output "Ü"文字が表示されます。これは行の高さを上回っています...そして他にもたくさんありますフォントにも属している特殊文字。 – Johannes

関連する問題