横棒GIF左右ぴったしにするタグは？？

質問

あるGIFの横棒素材を使って<hr>の代わりに使いたいのですがサイズが変更は出来るもののブラウザのサイズによって左右が空いたりオーバーしたりしてしまいます。<hr>の様に画面サイズに合わせた横棒にするタグってありませんか？
探したのですが検索ワードが悪いのか見つからず・・・。

あと、同じ素材を何度も同じページで使った場合、ページのサイズに影響は出ないのでしょうか
例→上記の横棒GIF画像を10本使っていて1つの容量が4KB、その他が5KBとすると、ページ合計の容量は45KBとならずに9KBでしょうか？

回答No.3

noname#24751 · ベストアンサー

度々申し訳ありません。
NO2です。
ちょっと間違いがありましたので訂正します。

～・●・～の場合、
画面解像度によって端が切れるかもしれませんが
<div style="width:100%;height:○○px(画像の高さ);background-image:url(○○.gif);background-repeat:no-repeat;background-position:center;"></div>

「"」が変なところに入っていました(汗)

回答No.5

noname#61366

No.4の方が答えてらっしゃいますが...
<img src="○○.gif" width="100%" height="x">
で<hr>と同様に表示されます。
もちろんデブになったり、細くなったりするわけですが...

回答No.4

noname#39234

正確には転送量は変わらないけど
表示に必要なメモリー量は増える。

これは、OSのメモリー消費をモニタリングしながら
同じ画像をそのまま表示と10倍表示とでロードすると
メモリー消費の変化で判別ができる。

もっとも転送量はサーバーの都合で
大きな問題になる場合があるけれど

メモリー消費が問題になることは
ほとんど無いだろうとは思う。
というか、表示面積(ピクセル数)が同じであれば
hr tagで引いた場合と、大差は無いはず。

あと、img tagにもwidth値を%指定できたと思った。
CSS手書きに移行して二年経って
その後一年放置しているので、記憶は曖昧ですが。

回答No.2

noname#24751

はじめまして。

その横棒は----------のように、端から端まで
同じ模様なのでしょうか？
それとも～・●・～のように全部が均一ではない
模様なのでしょうか？

--------の場合、私でしたら
<div style="width:100%;height:○○px(画像の高さ);background-image:url(○○.gif);background-repeat:repeat-x;"></div>

試しにやってみたらIE6では表示されました。
NNやMacIEやopera等の他のブラウザではどうなんだろう?

～・●・～の場合、
画面解像度によって端が切れるかもしれませんが
<div style="width:100%;height:○○px(画像の高さ);background-image:url(○○.gif);background-repeat:no-repeat;"background-position:center;></div>

しか思い浮かびません(涙)

お役に立てないかもしれませんがよろしかったら
ご参考になさってみて下さい。

回答No.1

nekonyanko

テーブルをつくり、テーブルの背景とすればできると思います。
<table width="100%" height="gif画像の高さ" background="yokobou.gif">
<tr><td></td></tr></table>
みたいに。

それから同じファイルを繰り返し使ってもそのファイルを参照してるだけなのでその分だけ増えるということはないですね。