WEBサイト作成【HTML CSS JavaScript PHP CGI Perl Ruby Python .htaccess】

画像ダウンロード対策（右クリックでの画像保存を禁止）

<html>
<head>
<title>画像ダウンロード対策</title>

<style type="text/css">
<!--
.img1    {
    position:    relative;
}
.guard1    {
    position:    absolute;
    top:        0px;
    left:        0px;
    width:        320px;
    height:        240px;
    background:    url(../../sample/img/guard.gif);
}
//-->
</style>

</head>
<body>
画像ダウンロード対策（右クリックでの画像保存を禁止）<br>
画像を透明画像（guard.gif）でガード。<br>
<p class="img1"><img src="../../sample/img/img.jpg" alt="画像1"><span class="guard1"></span></p>
</body>
</html>

〔実行する〕

スタイルシート(CSS)

●全体の背景色（background-color）	●全体の背景画像（background-image）
●全体の背景画像（固定　background-attachment）	●全体の背景画像（横のみ繰り返し　repeat-x）
●全体の背景画像（縦のみ繰り返し　repeat-y）	●全体の背景画像（位置指定　background-position）
●全体の背景一括指定（background）	●全体の文字色（color）
●リンク色（link, visited, hover, active）	●スクロールバーの色（scrollbar）
●フォント（font-family）	●文字サイズ（font-size）
●文字の太さ（font-weight）	●文字色（color）
●文字装飾（text-decoration）	●斜体（font-style）
●上付き文字・下付き文字（vertical-align）	●大文字変換・小文字変換（text-transform）
●行の高さ（line-height）	●文字間隔（letter-spacing）
●行揃え（text-align）	●１行目にインデント（text-indent）
●段落の１行目を装飾（first-line）	●段落の最初の１文字を装飾（first-letter）
●縦書き（writing-mode）	●自動改行しないで表示（white-space, nowrap）
●文字の背景色（background-color）	●文字の背景画像（background-image）
●枠（border-style）	●枠（太さ指定　border-width）
●枠（色指定　border-color）	●枠（一括指定　border）
●幅・高さ（width, height）	●マージン（外側の間隔　margin）
●パディング（内側の間隔　padding）	●リストスタイル（list-style-type,list-style-image,）
●番号つきリリスト（list-style-type,padding-left）	●画像サイズ（width）
●画像回り込み（float）	●画像にフィルター（透明度　filter, alpha）
●画像に枠（border）	●画像の重ね合わせ・重ねる順番指定（z-index）
●罫線の色・幅・高さ・枠	●フォームの色・サイズ
●IMEの入力モードの指定（ime-mode）	●カーソルの形を指定（cursor）
●ボタン風リンク	●画像ダウンロード対策（右クリックでの画像保存を禁止）

WEBサイト作成【HTML CSS JavaScript PHP CGI Perl Ruby Python .htaccess】