Word2000でホームページ作成ちょこっとまめ知識　by tomisan.com

▼	ウイルスに関する情報と対策
└	ウイルスTOP10＆最新ウイルス警告10種
▼	スタイルシート
├	リンクの文字色変更
├	スクロールバーの色
├	背景画像の固定
├	ページ内にスクロールバー
└	スタイルシートの記述例
▼	JavaScript
├	印刷ボタン／ページを開いたときに小窓を開く／ボタンで小窓を開く／小窓を数秒後に閉じる／お気に入りに追加ボタン／メール送信ボタン
├	サムネイルクリックで別ウインドウぴったりサイズの画像表示
├	子ウインドウからメインウインドウ操作
├	JavaScriptで戻る・更新・進む
└	メール送信フォーム
▼	その他
├	お気に入りのアイコン
├	BGMを鳴らす／MIDI
├	フレームページのソース
└	国際標準サイズのバナー

背景画像の固定

背景に画像を使った場合、全体に繰り返し（リピート）されて表示されますが、スタイルを指定することで好きな位置に表示させることができます。

background-attachment: fixed ⇒背景がスクロールしない
background-repeat: repeat-y ⇒縦方向に繰り返す
background-repeat: repeat-x ⇒横方向に繰り返す

background-position: right bottom
・位置を表すキーワードで指定（left,right,center／top,bottom,center）
・値で指定（左端から横方向の位置%,上から縦方向の位置%）
・数値で指定（左端から横方向の位置px,上から縦方向の位置px）

◆左端から縦方向に並べる

body {
	background-image: url("***.gif");
	background-repeat: repeat-y;
	background-attachment: fixed }

◆右端から縦方向に並べる

body {
	background-image: url("***.gif");
	background-repeat: repeat-y;
	background-position: right;
	background-attachment: fixed }

◆左端から離して縦方向に並べる

body {
	background-image: url("***.gif");
	background-repeat: repeat-y;
	background-position: 100px;
	background-attachment: fixed }

例）左端から100px離す

◆上端に横方向に並べる

body {
	background-image: url("***.gif");
	background-repeat: repeat-x;
	background-attachment: fixed }

◆下端に横方向に並べる

body {
	background-image: url("***.gif");
	background-repeat: repeat-x;
	background-position: bottom;
	background-attachment: fixed }

◆上端から離して横方向に並べる

body {
	background-image: url("***.gif");
	background-repeat: repeat-x;
	background-position: 30%;
	background-attachment: fixed }

例）上端から30%離す

◆左上に並べないで固定する

body {
	background-image: url("***.gif");
	background-repeat: no-repeat;
	background-attachment: fixed }

◆左下に並べないで固定する

body {
	background-image: url("***.gif");
	background-repeat: no-repeat;
	background-position: left bottom;
	background-attachment: fixed }

◆右上に並べないで固定する

body {
	background-image: url("***.gif");
	background-repeat: no-repeat;
	background-position: right top;
	background-attachment: fixed }

◆右下に並べないで固定する

body {
	background-image: url("***.gif");
	background-repeat: no-repeat;
	background-position: right bottom;
	background-attachment: fixed }

◆好きな位置に並べないで固定する

body {
	background-image: url("***.gif");
	background-repeat: no-repeat;
	background-position: 400px 350px;
	background-attachment: fixed }

例）左から400px、上から350pxの位置

▲このページの先頭へ

Copyright(C) tomisan.com All rights Reserved.