表示されているタグをコピー＆ペーストして使用してくださいね♪
画像を貼り付ける
<IMG SRC="http://．．．画像のＵＲＬ">
画像のサイズを変える
<IMG SRC="http://．．．画像のＵＲＬ"WIDTH="横幅％" height="縦幅％">
画像に枠をつける
<IMG SRC="http://．．．画像のＵＲＬ"BORDER="5">
画像の横に入れるテキストの位置
上だよ♪
真中だよ♪
下だよ♪
<IMG SRC="http://．．．画像のＵＲＬ" ALIGN="位置">本文<BR>
「位置」の所に上なら「ｔｏｐ」
真ん中なら「ｍｉｄｄｌｅ」
下なら「ｂｏｔｔｏｍ」を入れます
画像の横に長い文のテキストを入れる
画像の右側に
入れたいときは
位置に
「ｌｅｆｔ」
といれます。
画像の左側に
入れたいときは
位置に
「ｒｉｇｈｔ」
といれます。
<IMG SRC="http://．．．画像のＵＲＬ" ALIGN="位置">本文<BR>
画像の両脇の余白を指定する
これは
指定しない場合
横がぴったりと
くっついてるでしょ
これは
余白を指定した場合
少し開けると
見やすいでしょ
<IMG SRC="http://．．．画像のＵＲＬ" ALIGN="left" HSPACE="30">
これは<BR>
余白を指定した場合<BR>
少し開けると<BR>
見やすいでしょ<BR>
<BR><BR><BR><BR><BR>
画像の上下の余白を指定する
これは
余白を指定した場合
少し開けると
見やすいでしょ
<IMG SRC="http://．．．画像のＵＲＬ" ALIGN="left" VSPACE="30">
これは<BR>
余白を指定した場合<BR>
少し開けると<BR>
見やすいでしょ<BR>
<BR><BR><BR><BR><BR><BR>
画像にテキストを回り込ませる
正解だと思ったら○
間違いだと思ったら×
さてどっちだ？？？
<IMG SRC="http://．．．画像のＵＲＬ" ALIGN="left">
正解だと思ったら○<BR>
間違いだと思ったら×<BR CLEAR="left">
さてどっちだ？？？
テキストの左側にしたいときは「ｌｅｆｔ」の部分を
「ｒｉｇｈｔ」に変えてね♪
画像にカーソルをあわせると名前を表示する
<IMG SRC="http://．．．画像のＵＲＬ" ALT="画像の名前">
画像を使ってお気に入りに追加する
<INPUT type="image" value="ホームページの名前" onclick="window.external.AddFavorite('http://．．．ホームページのＵＲＬ','ホームページの名前')" ;? src="http://．．．画像のＵＲＬ" alt="♪お気に入りに追加♪">
背景画像を設定する．．．通常の方法
サンプルページ
<BODY style="background:url(http://．．．画像のＵＲＬ);">
背景画像を設定する．．．背景を固定する
サンプルページ
<BODY style="background:url(http://．．．画像のＵＲＬ);background-attachment:fixed">
背景画像を設定する．．．横方向のみの場合
サンプルページ
<BODY style="background:url(http://．．．画像のＵＲＬ);background-repeat:repeat-x">
背景画像を設定する．．．縦方向のみの場合
サンプルページ
<BODY style="background:url(http://．．．画像のＵＲＬ);background-repeat:repeat-y;
背景画像を設定する．．．一つだけの背景の場合
サンプルページ
<BODY style="background:url(http://．．．画像のＵＲＬ);background-repeat:no-repeat;
背景画像を設定する．．．背景画を並べはじめる位置の指定
サンプルページ
<BODY style="background:url(http://．．．画像のＵＲＬ);background-repeat:no-repeat;background-position:横の位置 縦の位置>
横の値の部分を、左「left」,真ん中「center」, 右「right」
縦の値の部分を、上「top」,真ん中「center」,下「bottom」
横と縦を半角スペースで区切る「left center」
画像を半透明にする
サンプルページ
以下のタグを<head>〜</head>タグ間に記入してください。
<STYLE type="text/css">
<!--
.abc{
filter:Alpha(opacity=90 style=2);
}
-->
</STYLE>
Alpha は、画像の透明度を設定します。
グラデーションの初期値と最終値は opacity で1〜100の数値を設定。
100が不透明です。 start,finishで、始点と終点を指定。
style=0 グラデーション無し
style=1 線形グラデーション
style=2 円形グラデーション
style=3 四角形グラデーション
以下の部分を<body>〜</body>の間の表示させたい場所に入れてください。
<IMG src="http://．．．画像のＵＲＬ" class="abc">
背景画像を半透明にする
元の画像は(￣。￣)σ 
サンプルページ
<BODY background="http://．．．画像のＵＲＬ" style="filter:Alpha(opacity=20)">
背景画像を設定する．．．スタイルシートで壁紙の位置を指定する
サンプルページ
以下のタグを<head>〜</head>タグ間に記入してください。
<STYLE type="text/css">
<!--
BODY{
background-image : url(http://．．．画像のＵＲＬ);
background-repeat: no-repeat;
background-position: center center;
background-attachment: fixed;
}
-->
</STYLE>
背景画像の位置指定は
background-position : center top; 中央、上
background-position : center center; 中央、中央
background-position : center bottom; 中央、下
background-position : right top; 右、上
background-position : right center; 右、中央
background-position : right bottom; 右、下
background-position : left top; 左、上
background-position : left center; 左、中央
background-position : left bottom; 左、下
背景の画像のコントーロールは
background-repeat : repeat-x; 水平方向に繰り返す
background-repeat : repeat-y; 垂直方向に繰り返す
background-repeat : no-repeat; 繰り返さない
background-attachment : scroll; 背景スクロール
background-attachment: fixed; スクロールしない
画像の背景を透過する
サンプルページ
<IMG src="http://．．．画像のＵＲＬ" style="Filter: Chroma(Color=#FFFFFF)">
Filter: Chroma(Color=表示したくない色の16進値)
画像を白黒画像にする
サンプルページ
<IMG src="http://．．．画像のＵＲＬ" style="Filter: Gray">
画像をネガのような画像にする
サンプルページ
<IMG src="http://．．．画像のＵＲＬ" style="Filter: Invert">
画像をレントゲン写真のような画像にする
サンプルページ
<IMG src="http://．．．画像のＵＲＬ" style="Filter: XRay">
画像をウェーブ化する
サンプルページ
<IMG src="http://．．．画像のＵＲＬ" style="Filter:wave(lightstrenght:ウェーブの強さ)">
サンプルは「30」です
背景画像をウェーブ化する
サンプルページ
<BODY style="background-image:url(http://．．．画像のＵＲＬ);filter:wave(lightstrength:ウェーブの強さ)">
サンプルは「30」です
おまけ．．．背景色をウェーブ化する
サンプルページ
<BODY style="background-color:pink;filter:wave(lightstrenght:30)">
サンプルは「30」です
画像をクリックすると背景画像が変わる
サンプルページ
<IMG SRC="http://．．．画像のＵＲＬ" ONCLICK="document.body.style.backgroundImage='URL(http://．．．画像のＵＲＬ)';" STYLE="cursor:hand;">
画像で戻る、進む、リロードなどのボタンを作る
以下を表示させたい位置に記述して下さい（BODYタグの中ならどこでもＯＫ）
<a href="javascript:history.go(-1)">
<img src="http://．．．画像のＵＲＬ" alt="戻る" border="0"></a>
<a href="javascript:history.go(1)">
<img src="http://．．．画像のＵＲＬ" alt="進む" border="0"></a>
<a href="javascript:history.go(0)">
<img src="http://．．．画像のＵＲＬ" alt="更新" border="0"></a>