HTMLヘッダーの幅をテキストコンテンツに合わせるにはどうすればよいですか？

おそらく信じられないほど簡単な質問ですが、ここに行く：HTMLヘッダーの幅をテキストコンテンツに合わせるにはどうすればよいですか？

色付きの背景を持つさまざまなHTMLヘッダーがあります。

問題は、特定の幅を指定しない限り、現在のスペースの幅の100％を占めるように見えることです。幅に割り当てることができる属性があります。タイトル自体の長さ？

2011-01-18 Jack Roscoe

あなたはインライン要素としてレンダリングするヘッダ要素を指定した場合、それはそれだけの大きさ、これが効果

<div id="header"></div> 

#header { 
    display: inline; 
}

出典

2011-01-18 10:04:44

は注意してください：作りますdivインラインでブロックプロパティが失われます！ – jrharshath

あります上の他のノックを持っているかもしれませんが内容、心の中で熊のに成長します - ここではあまり詳しく私はあなたのような何かを意味すると仮定しています：

<div id="header"><h1>My Title</h1></div> 
<style> 
#header {background:red;} 
</style>

をして、あなたの問題は、H1タグが未知の長さであるのですか？その場合は、その後、あなただけH1の背景を設定し、そしておそらくいくつかのパディングを追加することができます...

<style> 
#header h1 {background:red;} 
</style>

出典

2011-01-18 10:08:15 Neokoenig

あなたはインライン要素で内容を囲むことができます。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head><title></title> 
<style type="text/css"><!-- 
th{ 
    background-color: white; 
} 
th span{ 
    color: white; 
    background-color: red; 
} 
--></style> 
</head> 
<body> 

<table> 
<tr> 
    <th><span>A<span></th> 
    <th><span>B<span></th> 
    <th><span>C<span></th> 
    <th><span>D<span></th> 
</tr> 
<tr> 
    <td>Lorem</td> 
    <td>Ipsum</td> 
    <td>Dolor</td> 
    <td>Sic</td> 
</tr> 
</table> 

</body> 
</html>

出典

2011-01-18 10:11:08

HTMLヘッダーの幅をテキストコンテンツに合わせるにはどうすればよいですか？

答えて

関連する問題