あるGIFの横棒素材を使って<hr>の代わりに使いたいのですがサイズが変更は出来るもののブラウザのサイズによって左右が空いたりオーバーしたりしてしまいます。<hr>の様に画面サイズに合わせた横棒にするタグってありませんか?
探したのですが検索ワードが悪いのか見つからず・・・。
あと、同じ素材を何度も同じページで使った場合、ページのサイズに影響は出ないのでしょうか
例→上記の横棒GIF画像を10本使っていて1つの容量が4KB、その他が5KBとすると、ページ合計の容量は45KBとならずに9KBでしょうか?
No.3ベストアンサー
- 回答日時:
度々申し訳ありません。
NO2です。
ちょっと間違いがありましたので訂正します。
~・●・~の場合、
画面解像度によって端が切れるかもしれませんが
<div style="width:100%;height:○○px(画像の高さ);background-image:url(○○.gif);background-repeat:no-repeat;background-position:center;"></div>
「"」が変なところに入っていました(汗)
No.5
- 回答日時:
No.4の方が答えてらっしゃいますが...
<img src="○○.gif" width="100%" height="x">
で<hr>と同様に表示されます。
もちろんデブになったり、細くなったりするわけですが...
No.4
- 回答日時:
正確には転送量は変わらないけど
表示に必要なメモリー量は増える。
これは、OSのメモリー消費をモニタリングしながら
同じ画像をそのまま表示と10倍表示とでロードすると
メモリー消費の変化で判別ができる。
もっとも転送量はサーバーの都合で
大きな問題になる場合があるけれど
メモリー消費が問題になることは
ほとんど無いだろうとは思う。
というか、表示面積(ピクセル数)が同じであれば
hr tagで引いた場合と、大差は無いはず。
あと、img tagにもwidth値を%指定できたと思った。
CSS手書きに移行して二年経って
その後一年放置しているので、記憶は曖昧ですが。
No.2
- 回答日時:
はじめまして。
その横棒は----------のように、端から端まで
同じ模様なのでしょうか?
それとも~・●・~のように全部が均一ではない
模様なのでしょうか?
--------の場合、私でしたら
<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
- 回答日時:
テーブルをつくり、テーブルの背景とすればできると思います。
<table width="100%" height="gif画像の高さ" background="yokobou.gif">
<tr><td></td></tr></table>
みたいに。
それから同じファイルを繰り返し使ってもそのファイルを参照してるだけなのでその分だけ増えるということはないですね。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- Instagram Instagramの投稿を、16:9の画像サイズにして、その画像真ん中の、自分のページを見たときの各 0 2023/08/08 00:17
- その他(ソフトウェア) 画像の拡大率を固定したまま次の画像を表示出来るビューアを探しています 2 2022/05/13 17:19
- その他(動画サービス) VLCメディアプレーヤーについて 1 2022/11/29 14:19
- HTML・CSS トリミングで表示した画像をクリックで元どおりにしたい 3 2022/12/16 18:49
- デザイン 縦18.0cm 横13.5cm の紙はどの用紙サイズに近いか 4 2022/08/13 11:00
- Windows 10 Windowsのアイコンの整列が変になりました 2 2022/06/24 00:02
- Ameba(アメーバブログ) アメブロは、HTMLのタグの入力を許さないブログ・サイトですか? 1 2023/06/18 18:48
- ホームページ作成・プログラミング アメーバ・ブログは"HTMLタグ"を許可してないのですか? 2 2023/06/17 21:08
- Visual Basic(VBA) 【VBA】写真の貼り付けコードがうまく機能しません。 5 2022/09/01 18:43
- Excel(エクセル) エクセルのグラフに上下限値の横棒を表示させたい 5 2022/12/12 11:09
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
iframe内をクリックさせない方...
-
HTMLで使う「見出し」は英文で...
-
background-repeat CSS で切れ...
-
【CSS】【HTML】横並びメニュー...
-
サイトでオープニングでスライ...
-
自分で壁紙を作成して、ホーム...
-
背景が透けると文字も透ける
-
cssで背景画像をランダム表示する
-
横棒GIF左右ぴったしにするタグ...
-
HP作成 作成した画像を動画の上...
-
同じ画像 複数回使用
-
ページの上下に白い横線が入る
-
背景画像の上に透過GIF背景...
-
Firefoxだけ文字の大きさの制御...
-
CSSで背景画像をランダムに表示...
-
影付き(透過)ロゴタイトルの表...
-
background-sizeでcontainする...
-
たくさんのjpgファイルをスクロ...
-
IMGタグでTIFF画像を表示
-
イラレで背景を透明にするやり...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
<hr>の縦バージョンはありますか?
-
画像の上にテキスト配置で、拡...
-
background-repeat CSS で切れ...
-
【至急お助け!】チェックボッ...
-
iframe内をクリックさせない方...
-
画像とその下にあるテキストの...
-
【Webサイト】画像が小さく表示...
-
htmlかcssで背景の白い枠をなく...
-
同じ画像 複数回使用
-
background-sizeの背景で最小値...
-
IMGタグで画像の繰り返し使用は…
-
background-sizeでcontainする...
-
lightbox2で画像を天地左右中央...
-
コーディング中、右側に謎の余...
-
画像上に文字を表示するとiPhon...
-
背景画像をリピートさせない方...
-
LightBoxの矢印の出し方
-
CSSで背景画像をランダムに表示...
-
フッターの背景に色を指定した...
-
透過gif画像の上に文章を重ねる...
おすすめ情報