人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

ホームページ作成について質問です。
1600×1200pixの写真をどんなパソコンのウィンドウにも中心部がセンターに
なっているホームページを作りたいと思っています。
ウィンドウサイズが800×600の場合でもセンターから表示できるようにするには
どうしたらよいでしょうか?

●質問者: demati
●カテゴリ:ウェブ制作
✍キーワード:ウィンドウ サイズ センター パソコン ホームページ
○ 状態 :終了
└ 回答数 : 1/1件

▽最新の回答へ

1 ● indiana
●60ポイント

ウインドウからはみ出してでもセンターを表示させたいということでしょうか。

それなら、<div>などのタテヨコを100%にして、その背景に該当画像を設定します。

そのうえで背景画像の位置を50%にすれば、常にセンターに表示されます。


ソースの例としては以下になります。

<html>
<title>ページタイトル</title>
<head>
<style type="text/css">
<!--
/*念のためhtmlタグとbodyタグの高さを100%に*/
html,body{
height:100%;
}

/*画像を表示する<div>タグに適用するCSS*/
.center-image{
width:100%;
height:100%;
background-image:url(画像のURL);
background-position:50% 50%;
background-repeat:no-repeat;
}
-->
</style>
</head>
<body>

<!--<div>タグの中には何も入れません-->
<div class="center-image"></div>

</body>
</html>

または、画像を別ウインドウとして開く場合には、body自体に背景画像として設定してもいいかもしれません。

<html>
<title>ページタイトル</title>
<head>
<style type="text/css">
<!--
/*念のためhtmlタグとbodyタグの高さを100%に*/
html,body{
height:100%;
}

/*画像を表示する<div>タグに適用するCSS*/
body{
background-image:url(画像のURL);
background-position:50% 50%;
background-repeat:no-repeat;
}
-->
</style>
</head>
<body>

<!--<body>タグの中には何も入れません-->

</body>
</html>

こういう回答で大丈夫でしょうか・・・


http://www.htmq.com/style/background-image.shtml

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ