divの幅が固定されているため、1行以上のdivにH1があります。背景色をH1テキストのみに設定して、背景がテキストの後ろにのみ残るようにします(たとえば、行の終わりに空のスペースがある場合は、そこで背景色を使用しないでください)。
また、テキストの左右のパディングを設定する必要があります。見出しにパディングを設定しようとしましたが、機能しません。
これが私が取得しようとしているものです:
H1の表示を設定し、背景色を設定してこれを実現しようとしていinline
ますが、うまくいかないようです。以下は私のHTMLとCSSとデモです。
HTML:
<div class="box">
<h1>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin eget massa felis, at aliquam libero. </h1>
CSS:
.box{
background: green;
overflow: hidden;
max-width: 100px;
margin: 50px auto;
padding: 20px;
}
h1{
background: yellow;
font-size: 30px;
float: left;
display: inline;
}
デモ: http: //jsfiddle.net/BQMXa/