ここから本文です

画面サイズに拘わらずイラストを両端に表示させるHTMLを教えて下さい。

umo********さん

2010/5/2716:58:11

画面サイズに拘わらずイラストを両端に表示させるHTMLを教えて下さい。

ホームページを作成しているのですが、

黒の背景で画面の両端にイラストを挿入したいと考えています。

背景にイラストを貼り付けただけでは、

画面サイズによって切れたり、変な余白がでてきたりしてしまいます。


A.jpg、B.jpgのイラストがあるとして、それを画面サイズに拘わらず、

常にAを左端、Bを右端に表示させる方法があれば、ご教授願います。


よろしくお願い致します。

この質問は、活躍中のチエリアン・専門家に回答をリクエストしました。

閲覧数:
946
回答数:
1
お礼:
100枚

違反報告

ベストアンサーに選ばれた回答

kaa********さん

2010/5/2719:06:33

CSSでは、座標を左から、上からだけでなく、右から、下から何px、というふうにも座標を指定できるので
それを使います。

<!--サンプル-->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Language" content="ja">
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<meta http-equiv="Content-Style-Type" content="text/css">
<title>sample</title>
<style type="text/css">
<!--
p#right img{
position:absolute;/*絶対座標で位置を指定する*/
right:0px;/*右から0pxの位置*/
}
p#left img{
position:absolute;/*絶対座標で位置を指定する*/
left:0px;/*左から0pxの位置*/
}
-->
</style>
</head>
<body>
<h1>ウィンドウの両端に画像を表示</h1>
<p id="right"><img src="B.jpg" alt="B.jpg"></p><!--右側に表示する画像-->
<p id="left"><img src="A.jpg" alt="A.jpg"></p><!--左側に表示する画像-->
</body>
</html>
<!--ここまで-->

質問した人からのコメント

2010/5/28 10:24:22

笑う 丁寧にご回答くださり、ありがとうございました。
上手く表示させることが出来ました。
CSSは今まで避けてきましたが、勉強しなければと思う機会にもなりました。
ありがとうございました。

みんなで作る知恵袋 悩みや疑問、なんでも気軽にきいちゃおう!

Q&Aをキーワードで検索:

Yahoo! JAPANは、回答に記載された内容の信ぴょう性、正確性を保証しておりません。
お客様自身の責任と判断で、ご利用ください。
本文はここまでです このページの先頭へ

「追加する」ボタンを押してください。

閉じる

※知恵コレクションに追加された質問は選択されたID/ニックネームのMy知恵袋で確認できます。

不適切な投稿でないことを報告しました。

閉じる