- ベストアンサー
ホームページのバックについて
ホームページを創り始めたばっかりの初心者です。 ホームページのバックグラウンドに画像を張り付けたいのですが、 あれって画像サイズが小さかったら 同じ画像が何回もリピートしてしまいますよね。 それってリピートしないようにはできないんですか？ 例えば画面の左の方だけに出したりとかできないんでしょうか？ つまらない質問ですみませんが教えてください。
- a_820
- お礼率74% (44/59)
- その他（インターネット・Webサービス）
- 回答数2
- ありがとう数2
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
スタイルシートの書き方の例です。 <html> <head> <style type="text/css"> <!-- body{ background-image: url("画像の場所"); background-repeat: no-repeat; } //--> </style> <title>タイトル</title> </head> <body> ～本文～ </body> </html> という具合にします。 ●「画像の場所」は相対パスでも絶対パスでもかまいません。 ●「background-repeat」に対して「no-repeat」にするとくり返さなくなり、「repeat-x」で横方向のみの繰り返し、「repeat-y」で縦方向のみの繰り返しになります。 ●「background-color: 色;」を付けると背景色も同時に指定できます。 ●相対パスとは「../bg.gif」のようなもので、絶対パスとは「http://○○.com/hogehoge/bg.jpeg」といったタイプのものです。 ●色の指定では「white」「aqua」といったタイプのものでも「#FF80A0」のようなRGB指定のものでも可です。
その他の回答 (1)
- MARURI
- ベストアンサー率36% (56/153)
背景の固定は、スタイルシートでできます。 私がここにはしょって書くよりも解説されているＨＰで見たほうがわかると思いますので・・・。 ↓こちらへ行ってみてください。 http://www.tanasan.com/index.html コンテンツの「スタイルシート」→「色と背景」の中の「 背景画像の並び、背景画像の固定、背景画像の位置」あたりが参考になるかと思います。
補足
お答えありがとうございます。教えていただいたホームページに行ってみたんですが、よくわかりません。 ホームページで <STYLE TYPE="text/css"> <!-- BODY { background-image: url(../images/sun.gif) background-position: 50%と書いてあったんですが、これをHTMLのどこに差し込んだらいいのか？そして入れたい画像の名前は url(作った画像名.gif)みたいな入れかたでいいんでしようか？
関連するQ&A
- ホームページに画像を貼りたい
テキストエディットでHTMLを書き込んでホームページ作成をしている初心者です☆ 背景に画像を貼りたくてもどうやっても貼れなくて悩んでいます。 使っているパソコンはmacで、写真はFinderの中にあるマイファイルのイメージのoriginal.jpgを使いたいのです。 そこで、HTMLの方は body{background-image:url(マイファイル/イメージ/original.jpg); background-repeats:no-repeat; background-position:center;} と書き込みました。 CSSの方は、 body{ background-image:url(マイファイル/イメージ/original.jpg); background-repeats:no-repeat; background-position:center;} と書き込みましたが、ブラウザで見たところ写真が表示されなくて困っています。 本当に初心者で困っています。 できれば正しい写真の貼り方を教えていただきたいのですが、お願いします。
- 締切済み
- その他（インターネット・Webサービス）
- ホームページ 背景のサイズはどうやって？
ちょっと困っています。 現在、ホームページを作っているのですが 背景へ画像を設定したいのですが、どうしても サイズ調整の方法がわかりません。今の状態 だと、左上に表示されたままなのです。 現状、下記の状態です。知っている方おしえてください。お待ちしてます。 <!-- BODY{ background-image : url(file:///C:/Documents and Settings/ryotaira/My Documents/My Pictures/isigaki.gif); background-repeat : no-repeat; } --> 環境 ビルダー8、XP
- ベストアンサー
- ブラウザ
- ホームページビルダーＶ９での背景固定について
ホームページビルダーＶ９を使っています。 そこで、背景を固定したいのですが上手くいきません。 ソースに下のようなタグを入れても画像が表示されないんです。 どうしたら良いか教えてください。 <STYLE type="text/css"> <!-- BODY { background-color: #------; background-image : url("画像のURL"); background-attachment: fixed; background-position: 50% 50%; background-repeat: no-repeat; } --> </STYLE>
- 締切済み
- ホームページ作成ソフト
- ホームページの背景画像が途切れてしまう。
こんにちは。 現在、ホームページを作っているのですが、背景画像で困ってしまって質問しました。 ホームページはhtmlとCSSを使って、ホームページビルダーで作っています。 bodyに背景画像１を設定しています。 ホームページの内容は <div></div>の中にinnerというclassを作って スタイルシートで40ｐｘ×40ｐｘの背景画像２を「repeat」指定しています。 この背景画像２が、IEでは表示されているのですが、firefoxやchromeだと下のほうで 途切れてしまいます。 それも、ちゃんと表示できてるページと、途切れてしまうページの２種類があります。 原因を自分でも探してみたのですが、見つかりませんでした。 もし、知っている、気付いた方がいらっしゃったら教えていただけませんか？？ よろしくお願いします。 ちなみに、下記はスタイルシートに記載しているものです。 --------------------------------------------------------------------- body{ text-align:center; margin-right : auto;margin-left : auto; background-image : url(mokuteki/taiiku/bg_brown.png); background-repeat: repeat; font-size : 90%; padding-top : 0px; padding-bottom : 0px; margin-top : 0px; margin-bottom : 0px; } #wrap{ text-align : center; margin-top : 0px; margin-left : auto; margin-right : auto; margin-bottom : auto; width : 100%; padding-top : 0px; } .inner{ text-align : left; margin-top : 0px; margin-left : auto; margin-right : auto; width : 900px; background-image : url(images/bg_white.png); background-repeat : repeat; } -----------------------------------------------------------------
- ベストアンサー
- デザイナー・クリエイティブ職
- 固定背景画像と画面幅について
初心者のため、分かりづらい質問になると思いますがお許しください。 background-repeat:no-repeat; background-position:right; background-attachment:fixed; 上記のようなCSSで背景画像を固定しています。 画面幅は918pxで設定していますが、これをプレビューで918px以上に伸ばすと、背景画像がどんどん右にズレていってしまいます。 画面環境はそれぞれだと思うので、大きな画面で見た方が背景画像が切れてしまうのを避けたいです。 画面幅918pxで固定をしたいのですが、どのようにすればいいのでしょうか？ 何か補足事項があればすぐに追記します。 よろしくお願いします。
- ベストアンサー
- CSS
- 画像のソースを教えてください。
はじめまして。 ホームページ編集のときに使う画像のソースがわからなくて困っています。 画像を左に固定するのは <style type="text/css"> <!--body{background-attachment:fixed; background-image:url(※); background-repeat:repeat-y; background-position:left;}--> </style> でわかっているのですが、左右に固定するソースがわかりません。 恐らく最後のleftの部分を何かに変えるといいのかな？とは思うのですが。 教えていただけるとありがたいです・
- ベストアンサー
- HTML
- 背景画像の大きさ固定
テーブルの背景に画像を貼り付けて、その画像がテーブルいっぱいに表示されるようにしたいのですが、やり方がどうにもわかりません。 本来の画像のサイズはテーブルより大きいんですが、800×600でも1024×768でも同じように全画面表示になるって感じにしたいんです……ウィンドウのサイズに合わせて縮小する感じです。 スタイルシートで<td>内に background="aaa.jpg" style="background-repeat:no-repeat" と記述していますが、縮小ができません。 分かる方いらっしゃいましたら教えて下さい。 お願いします。
- ベストアンサー
- HTML
- 両端に背景画像を入れる
画面の左右両端に、縦に繰り返しで、画像を背景として入れたいのですがどうすればよいのでしょうか？ <STYLE type="text/css"> <!-- BODY { background-image : url("～～.gif"); background-position: left; background-repeat: repeat-y;} --> </STYLE> スタイルシートを使って、とりあえず左にだけ入れることは出来ました。 このあとを教えてください。お願いします。
- ベストアンサー
- HTML
- 背景画像の表示について
こんにちは。 初心者ですが、Yahooのジオシティーズでホームページを作っています。 今、頭を悩ませている要因が、背景画像についてです。 自作した画像があるのですが、それをアップデートしたURLでは、画面に収まりきるサイズだったのです。 でも、いざトップページに配置したら、なぜか勝手に拡大表示されている上に、スクロールバーが出ていません。 おかげで上下左右が見切れ、画像も荒くなってしまいました。 さらに、画像の繰り返しをしない設定（background-repeat:no-repeat；）をしたにもかかわらず、反映されていませんでした。 HTMLタグでもスタイルシートでも試してみましたが、同じような結果です。 イメージで配置したところ、サイズは同じように拡大されてしまいましたが、スクロールバーは出ました。 私の理想とする設定は、 【作ったままのサイズで 右端中央にひとつだけ表示し 画面サイズを超えてしまったパソコン(小さいノートパソコンなど)ではスクロールバーが表示される】 といったところでしょうか。 初心者なりに勉強して、HTMLやスタイルシートについては多少なりとも理解できるつもりです。 どうか、ご教授願います。
- 締切済み
- HTML
- 背景画像を2枚使いうまく繰り返す方法
htmlとcssでホームページを作っています。 背景画像を2枚使用しているんですが、どうしてもうまく表示されません。 1枚目はページ上部に。 2枚目はその下からすべて。 で、それぞれ横にリピート。 2枚目だけ縦にリピートして表示させようとしてます。 最初はbodyとdivで -------------------css-------------------------- body { background-image:url(""); background-repeat:repeat; } div.body { background-image:url(""); } ----------------html-------- <body> <div class="body"> 内容 </div> </body> --------------------------------------------- としています。 ですが、これだとdivのボックスができてしまい、横に無限に繰り返されないことになります。画面を縮小した時に切れてしまいます。 なので、htmlとbodyにそれぞれ背景をつけたんですが、 今度は両方の画像が表示されませんでした。 html { background-image:url(""); background-repeat:repeat-x; } body { background-image:url(""); } htmlのほうを消すと、bodyで指定した画像が縦横無限に繰り返されます。 htmlを消さずにbodyを無限に表示されるにはどうしたらいいですか？
- ベストアンサー
- HTML
お礼
とてもわかりやすい説明ありがとうございます。これからもホームページ制作の事どんどん勉強していきたいと思っています。自分で調べたホームページ制作サイトで分からない事があったらまた質問するかもしれません。その時はよろしくおねがいします。