masao
ＨＰを直しながら、画像のコラージュとつまり、、画像の重ねあわせがありました、紹介しておきます。
私のワンコウはこの画像の中に一つしかいません。、あとはサンプルの借り物です。
この重ねあわせは、z-index:11の数字が大きいほど前に来ます。英語でindexは索引と意味ですね。left: 239px; top: 187pxこれが、画像の位置ですね。
width:269px; height:80これが、画像の大きさ指定です。absolute;は絶対値といいまして。画面全体の中で位置を考える時です。それに対して相対値は何か他のものを基準に変えるときです。
下のソースそのまま、新規メールに貼り付けると、画像ははり付きません。画像がフルパスになってないからです。
フルパスに変えるときちんと張り付きますよ。このソースを直接使って、ファイル名のみ記載の時は、ファイルごとSTATIONARYファイルに入れて、雛形として、作成するとうまくいきます。
<html>
<head>
<title>画像のコラージュ</title>
<META
http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<META
http-equiv="Content-Style-Type"
content="text/css">
</head>
<body bgcolor="#FFFFFF"
text="#000000">
<div id="Layer1" style="position:absolute; width:269px; height:80; z-index:11; left: 239px; top:
187px">
<img src="title.gif" width="269"
height="80"></div>
<div id="Layer2" style="position:absolute;
width:150; height:97; z-index:3; left: 483px; top: 156px">
<img
src="1.jpg" width="150" height="97"></div>
<div id="Layer3"
style="position:absolute; width:150; height:113; z-index:6; left: 118px; top:
177px">
<img src="2.jpg" width="150"
height="113"></div>
<div id="Layer4" style="position:absolute;
width:200; height:150; z-index:2; left: 377px; top: 46px">
<img
src="3.jpg" width="200" height="150"></div>
<div id="Layer5"
style="position:absolute; width:210; height:158; z-index:1; left: 415px; top:
229px">
<img src="4.jpg" width="210"
height="158"></div>
<div id="Layer6" style="position:absolute;
width:250; height:173; z-index:4; left: 186px; top: 226px">
<img
src="5.jpg" width="250" height="173"></div>
<div id="Layer7"
style="position:absolute; width:250; height:208; z-index:5; left: 158px; top:
7px">
<img src="6.jpg" width="250"
height="208"></div>
<div id="Layer8" style="position:absolute;
width:100; height:40; z-index:8; left: 249px; top: 40px">
<img
src="spr.gif" width="100" height="40"></div>
<div id="Layer10"
style="position:absolute; width:100; height:40; z-index:10; left: 376px; top:
337px">
<img src="aut.gif" width="100"
height="40"></div>
<div id="Layer9" style="position:absolute;
width:100; height:40; z-index:9; left: 510px; top: 123px">
<img
src="sum.gif" width="100" height="40"></div>
<div id="Layer11"
style="position:absolute; width:100; height:40; z-index:7; left: 141px; top:
166px">
<img src="win.gif" width="100"
height="40"></div>
</body>
</html>
