こんばんは。
HTML言語でホームページを作成しており、次のように背景に"sea"という画像を設定しました。↓
<html>
<body background="sea">




</html>

しかしブラウザで表示してみると画像が小さく、もう少し背景画像を大きくしたいと思ったのですが、そのためにはどのような命令が必要でしょうか?
お願いいたします。

このQ&Aに関連する最新のQ&A

A 回答 (4件)

繰返しなしでよければ、bodyのbackgroundではなく、imgとして見かけ上バックグラウンドのように表示することはCSSで可能です。


この場合はサイズの変更も可能ですが、繰返し表示の場合はbackgroundでしかできないようなので、サイズを変えることが難しいみたいです。
#1様の回答のように、元の画像のサイズを変えるのが一番手っ取り早そうです。

画像を編集できるソフトでseaを開いてサイズを変えてしまいましょう。(先にバックアップをとっておいてください。)
例えば、Windws系ならPaintでも可能です。「変形」-「伸縮」で画像のサイズを変えて、そのまま保存して画像ファイルを入れ替えてみてください。
    • good
    • 1
この回答へのお礼

ありがとうございました!!助かりました☆

お礼日時:2008/09/23 11:05

 こんにちは



 (1)IMG要素を使ったら如何でしょうか?
<img src=”画像の名前”width=”画像の幅”height=”画像の高さ”>
 画像の幅と高さはピクセル数、或いはパーセントで指定します。パーセントは、ウィンドウに対するパーセントとなります。
<DIV style="top : 100px ; left : 433px ; position : absolute; z-index : 24;" id=""><IMG src="****.jpg" width="220" height="220" border="0">
</DIV>

 私の作ったページからコピーしてあります。数字はピクセルです。そちらで任意の数字を入れ替えてお試し下さい。
    • good
    • 1
この回答へのお礼

ありがとうございました!!助かりました^^

お礼日時:2008/09/23 11:04

タグの直接入力だとわかりませんが・・


ホームページビルダーの「どこでも配置モード」だと出来るようです。
http://support.microsoft.com/kb/882940/ja
しかしこれだと多分、1枚の画像の場合ですね。
「並べて配置」の場合はこれじゃないですね。
    • good
    • 0
この回答へのお礼

ご回答ありがとうございました!!ホームページビルダーはやはり便利ですね。

お礼日時:2008/09/23 11:06

背景画像(<body>指定)ではサイズは変えられません。


なので画像自体のサイズを変えるしかないですね…。

一応「HTML 背景画像 サイズ変更」で検索もしてみましたが、それらしい結果はありませんでした。
    • good
    • 0
この回答へのお礼

ご回答ありがとうございました!!助かりました^^

お礼日時:2008/09/23 11:07

このQ&Aに関連する人気のQ&A

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!

このQ&Aを見た人はこんなQ&Aも見ています

このQ&Aを見た人が検索しているワード

このQ&Aと関連する良く見られている質問

QHTMLの画像の位置の指定

HTMLで、画像の位置などを決めるときに、<div align="center"></div>などを使いますが、CSSやジャバスクリプトで使用している、


position:absolute; 絶対配置
position:relative; 相対配置
position:static; 通常配置(指定しない場合はこれ)
position:fixed;
上のようなポジションタグを使う事は可能ですか?

できれば、そのサンプルのようなものを書いてもらえると 助かります。

Aベストアンサー

こんばんは。
私は画像については良く位置指定をします。
インラインCSSで書きますと、

<div style="position:relative; top:100px; left: 20px;"><img src="ここに画像1へのパスを書きます/gazou1.jpg" width="330" height="200" border="0" alt="画像1"></div>

絶対指定なら;
<div style="position:absolute; top:100px; left: 20px;"><img src="ここに画像1へのパスを書きます/gazou1.jpg" width="330" height="200" border="0" alt="画像1"></div>

QHTMLでテーブルを横に並べる方法

HTMLでホームページを作っています。
テーブルを横に二つ並べたいのですが、二つ目のテーブルはどうしても最初のテーブルの下の段になってしまいます。どうしたら横に並べることができますか?
教えていただければ幸いです。
よろしくお願いします。

Aベストアンサー

2列のテーブルを作ったらいかがでしょうか?
<table>
<tr>
<td>1つめのテーブルに入れる内容</td>
<td>2つめのテーブルに入れる内容</td>
</tr>
</table>

それぞれのテーブルをそのまま使いたいならば、
↑のテーブルのセルの中に、それぞれ入れれば2つ並びます。
<table>
<tr>
<td><table>←1つめのテーブル→</table></td>
<td><table>←2つめのテーブル→</table></td>
</tr>
</table>

Q背景画像をブラウザサイズに合わせる方法。

初心者です。
HPの背景画像を、閲覧者のブラウザサイズに合わせて拡大縮小させる方法を教えてください。
いろいろ調べてやってみたのですがうまくいきません…。
よろしくお願いいたします。

Aベストアンサー

ついさっき別の質問で似たようなケースがあったが、
その参照サイトが jQueryで、
http://puzzel.jp/blog/sample/s15/

文法とか気にしなければ、最単な方法で、

<body style="margin:0; padding:0;">
<img src="***" width="100%" alt="*" style="position:absolute; top:0; z-index:-1;">

最小幅 min-width: ; も必要かな。高さをどうするのか・・・

Qスペースを使わず文字位置を揃える方法

素人な者で大変申し訳ありません
以下のように、複数行の文字位置を揃えるタグはどうなるのでしょうか?
(下の例は揃っていませんが・・・)

1.あ        :ABC
2.abc       :ABC
3.あいう      :ABC
4、えお       :ABC

のように、空白部にスペースを使わずに文字位置を揃える方法です
ワードなどの「tabキー」の役割をするタグなんてありますか?

ご教示の程、宜しくお願い致します

以上

Aベストアンサー

 これは、No.がある序列リストですか?あるいは、用語とその説明のようなものでしょうか?
 HTMLは、その文書構造を記述するだけですので、それにしたがってマークアップすれば良いです。
[例][用語とその説明のようなもの]のようですから定義リストでマークアップしてみましょう。
<h3>元素</h3>
<dl class="periodic table">
<dt>水素</dt>
<dd>元素記号(H)、原子量1.008、酸素と共に水をくつる。</dd>
<dt>ヘリウム</dt>
<dd>元素記号(He)、原子量4.003、不活性ガス</dd>
<dt>リチウム</dt>
<dd>元素記号(Li)、原子量6.941、リチウムイオン電池</dd>
</dl>

<h3>元素</h3>
<ol class="periodic table">
<li><span class="element">水素</span>元素記号(H)、原子量1.008、酸素と共に水をくつる。</li>
<li><span class="element">ヘリウム</span>元素記号(He)、原子量4.003、不活性ガス</li>
<li><span class="element">リチウム</span>元素記号(Li)、原子量6.941、リチウムイオン電池</li>
</ol>

これに対して、スタイルシートを次のように書いたりします。
dl.periodic.table{counter-reset: atomicNum 0;padding-left:2em;}
dl.periodic.table dt{float:left;font-weight:bold;}
dl.periodic.table dt:before{
content: counter(atomicNum) ". ";
counter-increment: atomicNum;
}
dl.periodic.table dd{margin-left:7em;}
dl.periodic.table dd:before{content:": ";}

ol.periodic.table span.element{float:left;width:7em;position:relative;font-weight:bold;}
ol.periodic.table span.element:before{content:": ";position:absolute;right:0.5em;}

★他にどのようにマークアップされていても、用語とその説明がが区別できるようにマークアップされていれば、デザインはできます。
★デザインのためにDIVやSAPNを追加しているわけではありません。
『DIV要素とSPAN要素は、id属性及び class属性と併用することで、文書に構造を付加するための一般機構を提供する。( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/struct/global.html#h-7.5.4 )』ものです。デザインのために書いてしまうと、デザインのためにtableを使ったのと大差ありません。
 HTML5では、
※DIVやSPANは他に適した要素がないときのための最後の手段
※文書構造を示すため
 となります。

 これは、No.がある序列リストですか?あるいは、用語とその説明のようなものでしょうか?
 HTMLは、その文書構造を記述するだけですので、それにしたがってマークアップすれば良いです。
[例][用語とその説明のようなもの]のようですから定義リストでマークアップしてみましょう。
<h3>元素</h3>
<dl class="periodic table">
<dt>水素</dt>
<dd>元素記号(H)、原子量1.008、酸素と共に水をくつる。</dd>
<dt>ヘリウム</dt>
<dd>元素記号(He)、原子量4.003、不活性ガス</dd>
<dt>リチウム</dt>
<dd>元素記号(L...続きを読む

Q画像の上に文字を乗せたい!

ちょっと質問です。
HTMLを作成していて、jpg(ジェイペグファイル)の上に
文字を乗せたい(上に書きたい)のは、どうすればできますか??

それと、bmpやgifなんかにも文字を乗せる時は同じやり方で
できるのでしょうか?
(または、そんなんできない)

もし、専用のソフトを使用しなければいけないのなら
なにか、いいソフトを教えてください。
よろしくお願いします。

Aベストアンサー

過去にも何回か同じ質問ありましたよ。

枠なしテーブルの背景として画像を入れれば、文字を乗せるくらいワケないんじゃ?
画像自体に文字を書き込みたいのであれば話は別ですが。

ちなみにbmp画像は、ブラウザによっては表示できないですよ。

Q画像を複数横に並べ、かつそれぞれの画像の下に文字を表示する

はじめまして!!質問のとおりです。

画像を横に複数表示しつつ、さらにそれぞれの画像の下に文字を表示(それそれの画像の横幅の範囲内に)するには、どうすればいいのでしょうか??

回答よろしくお願いしますm(_ _)m

Aベストアンサー

TABLEタグで横並びの1画像ずつ区切ってみてはいかがでしょう?
最小の画像横幅より狭くTD の幅指定をして画像の下に回り込みで
テキストを入れる形を取りborder=0に指定すれば罫線は表示されません。

http://www.geocities.co.jp/SiliconValley-Bay/7770/file/hf.html
http://www.tagindex.com/hp_guide/menu/02.html

Qホームページビルダーで背景画像がうまくいかない

ホームページビルダーでHPを作成している初心者ですが、どうも背景画像がうまくいきません。
どこでも配置モードで製作しているのですが、背景画像の大きさ(範囲)を指定できないものでしょうか?編集→ページのサイズ→800×600等を選んでも、背景画像の範囲が限定されるわけでもなく、画面いっぱいに背景画像が映し出されます。
ちなみに、挿入→画像ファイル→ファイルから壁紙として  このやり方で背景画像を設定すると、ぺーじ編集画面ではしっかりと背景画像が表示されるのですが、プレビューでは背景が表示されない不具合が出ました。(検索してみると同じ不具合が出る人が数人見つかり、一つだけ解決策が見つかったのでそれを実行しています。 http://www.aimix.jp/hpboldlog2/old3594.html   の一番下のやり方です。)

最悪、背景の問題が解決できなければ、ページの中央表示で妥協しようと思っています。
で、標準モードで製作していれば簡単にページの中央表示(真中寄せ)ができるようですが、今どこでも配置モードで製作していますので、どこでも配置モードで中央表示する方法はありませんか?
できれば全てにおいてhtmlタグは極力直接入力は避けたいです(わけがわかっていないので・・・)

お詳しい方よろしくお願いします。

ホームページビルダーでHPを作成している初心者ですが、どうも背景画像がうまくいきません。
どこでも配置モードで製作しているのですが、背景画像の大きさ(範囲)を指定できないものでしょうか?編集→ページのサイズ→800×600等を選んでも、背景画像の範囲が限定されるわけでもなく、画面いっぱいに背景画像が映し出されます。
ちなみに、挿入→画像ファイル→ファイルから壁紙として  このやり方で背景画像を設定すると、ぺーじ編集画面ではしっかりと背景画像が表示されるのですが、プレビューでは背...続きを読む

Aベストアンサー

>背景画像の範囲が限定されるわけでもなく、画面いっぱいに背景画像が映し出されます。

この意味は、背景画像が繰り返して、表示されるという意味でしょうか?

繰り返さないにするには「編集」「ページの属性」「ページの情報」タブを開いて「スタイル」ボタンを押します。「色と背景」タブの中に「繰り返さない」の設定があります。

しかし、「800×600」の画像では、左上に固定されます。

私は、画像ファイルのサイズを1100×915くらいに大きくして、背景として挿入でなく、画像ファイルの挿入にしていますが、表示されないとかの不具合は一度もありません。

バージョン8の時から、いまの11までですが。

もともと、ビルダーは、どこでも配置モードでは「常に画面の中央表示」はできません。最新バージョンの13ではどうなってるかわかりませんが。

どのサイズの画面でも、画面の中央表示にするには、標準モードで「表」をうまく使えば、かなり複雑な画面のレイアウトが出来ます。

Q背景画像をウィンドウサイズに合わせる方法

こちらを使っての質問は初めてのため、説明不足な点があるかもしれませんがよろしくお願いいたします。
alphaEDITというソフトを使ってホームページを作っています。
背景を設定するところまではできたのですが、ウィンドウを最大化から縮小にすると、背景の左上の部分に焦点がいってしまい、ページ全体を見るにはスクロールバーを動かさないと見れないという状態になっています。

縮小してもスクロールバーをつかわずページの大きさにウィンドウを合わせるように設定するにはどのようにすればよいのでしょうか?半日かけて調べたのですがこの類のことに疎いため自力で解決することができませんでした・・・。

HTMLソースを使って説明してくださる場合には、(仮に「haikei」という画像データを使用する場合)そのソースをどこに記入すればいいのか教えていただけると助かります。

粗末なものですが症状を説明する画像も用意しました。左側がウィンドウ最大化時、右側が縮小したときのものです。右側のイラストに書かれている灰色のラインはスクロールバーです。

いい加減な説明で申し訳ないのですが何卒、よろしくお願いいたします。

こちらを使っての質問は初めてのため、説明不足な点があるかもしれませんがよろしくお願いいたします。
alphaEDITというソフトを使ってホームページを作っています。
背景を設定するところまではできたのですが、ウィンドウを最大化から縮小にすると、背景の左上の部分に焦点がいってしまい、ページ全体を見るにはスクロールバーを動かさないと見れないという状態になっています。

縮小してもスクロールバーをつかわずページの大きさにウィンドウを合わせるように設定するにはどのようにすればよいのでしょうか?...続きを読む

Aベストアンサー

スタイルシート(CSS3)で背景画像をウィンドウサイズに合わせて調整する方法があります。
http://tips.nishishi.com/css/background-size-css3.html

いま作っているhtmlソースに合わせてcssを導入しましょう。
http://homepage.ojaru.jp/css.html

Q自分のサイトを開いた時にウィンドウのサイズを固定したい

いつもお世話になります。
htmlもよく分からずに自分のサイトを作っている、初心者です。
生意気な事ですが、デザインの関係で
自分のサイトを開いた時にウィンドウのサイズを
固定して見てもらいたいのですが、
どうすればよいのか分かりません。
もしかしたらここで聞く事ではないのかもしれませんが
なにぶんにも初心者なのでおわかりの方がいらっしゃれば
ぜひご教授ください
よろしくお願いします。

Aベストアンサー

サイトトップでJavaScriptから新しいウィンドウを開いて、指定のサイズのウィンドウ上で展開する場合のソース例です。

<html>
<head>
<title>Top page</title>
<script type="text/javascript"><!--
function winopen(){
var MainWin=window.open("tester.htm","MyWebSite","width=600, height=400, statusbar=1, location=1, menubar=1, toolbar=1, resizable=0, scrollbars=1");
}
//--></script>
</head>
<body>
<p><a href="呼び出すページのURL" onClick="winopen(); return false;">ENTER</a></p>
</body>
</html>

このようなソースにすると、このページのリンクをクリックした時に、JavaScriptで新しいウィンドウをサイズを指定して開き、そこに次のページを読み込むようになります。
もしJavaScriptが有効ではない環境で閲覧する場合には、新しいウィンドウは生成されず、トップページを表示したウィンドウ上で次のページが表示されるようになります。

ウィンドウサイズは、window.open()の括弧内にある、widthとheightで指定します。 単位はピクセルです。
その他にもいくつか指定を入れてありますが、このスクリプトの部分については、参考URLが詳しいので、そちらを参照してみてください。


ここからはアドバイスですが、可能であれば、やはりウィンドウサイズをリサイズさせなくてもすむデザインにしたほうが無難と思います。
先ほど書いた、フレームを使ってページの表示領域を制限する方法でも、ウィンドウサイズに左右されないデザインに近づけることができると思います。

他に、テーブルで囲んだり、スタイルシートによって表示の横幅を決めてしまえば、内容を表示する領域を固定値として確保できるので、ウィンドウ幅の差によるデザインの崩れを排除できる可能性もあるでしょう。
テーブルの場合は、通常のテーブルで横幅を指定し、その中に内容をすべて入れてしまえばよいだけです。
スタイルシートの場合は、
<div style="margin: auto; width: 600px;"></div>
で全体を囲めば、ウィンドウの横幅が変わっても内容の表示幅は変わらないようにできます。
もし、デザイン上のウィンドウサイズ指定が、ウィンドウの横幅が変わることでレイアウトが崩れることの防止策であるとするなら、これらの方法も対策になると思いますよ。

参考になれば幸いです。

参考URL:http://tohoho.wakusei.ne.jp/js/window.htm#open

サイトトップでJavaScriptから新しいウィンドウを開いて、指定のサイズのウィンドウ上で展開する場合のソース例です。

<html>
<head>
<title>Top page</title>
<script type="text/javascript"><!--
function winopen(){
var MainWin=window.open("tester.htm","MyWebSite","width=600, height=400, statusbar=1, location=1, menubar=1, toolbar=1, resizable=0, scrollbars=1");
}
//--></script>
</head>
<body>
<p><a href="呼び出すページのURL" onClick="winopen(); return false;">ENTER</a...続きを読む

Q画像の背景を透明にしたい

HTMLで<img src=>を使ってロゴ画像を貼り付けました
その後背景の画像をSSCで書いたのですが
ロゴの本来透明な部分が透明になりません

よくわからなかったので、フォーマットはPNGとGIFで試しましたがだめでした
JPGは背景を透明にはできなかったですよね?

そもそも背景を透明のまま保つことは不可能なのでしょうか?

Aベストアンサー

こんにちは、再び失礼します。

GIMP
http://hp.vector.co.jp/authors/VA025935/

こちらのヘルプを見てみましたが、PNGもGIFも透明度に対応している、と書かれています。
(GIFはGIMPのバージョンによっては入っていないかもしれないと書かれていましたが)

というわけで、直接の回答でなくて申し訳ありませんが、お使いのソフトは透過処理に対応しているようです、と申しあげておきます。

レイヤーの統合とかは関係ないですよ。
完成した画像の背景が透明になっているかどうか、そしてそれを保存するときのやりかたが問題です。

保存するときに背景の透過、とか透明、とかそういった選択部分はありませんか?
または環境設定などで行うのかもしれませんが、具体的な方法についてはご存知のかたにぜひともお答えいただきたいところです。


このQ&Aを見た人がよく見るQ&A

人気Q&Aランキング

おすすめ情報