|
■壁紙固定の仕方の簡易説明＆HTML
説明が不親切ですがどうぞご理解願いますよう・・m(_ _;)m もっと詳しく知りたいって方は、HTMLサイトなどを探してみてください。 まず、壁紙を固定するタグは以下の箇所に入れてください。
<html>
ここ・・というよりも、<head>〜</head>の間に入れてもらえれば結構です。<head> <title>ページのタイトル</title> ここに入れてください。 </head> <body> ページの内容などなど </body> </html> それでは、用途に合った壁紙固定タグをご説明致します。 色の変わってる文字の部分は各自適切なものにご修正願いますようお願い致します。 ■右一列に固定する
<style type="text/css"> <!--body{background-image: url(壁紙のファイル名);background-repeat: repeat-y;background-position: right;}--> </style> ■左一列に固定する
<style type="text/css"> <!--body{background-image: url(壁紙のファイル名);background-repeat: repeat-y;background-position: left;}--> </style> ■上一列に固定する
<style type="text/css"> <!--body{background-image: url(壁紙のファイル名);background-repeat: repeat-x;background-position: top;background-attachment: fixed;}--> </style> ■下一列に固定する
<style type="text/css"> <!--body{background-image: url(壁紙のファイル名);background-repeat: repeat-x;background-position: bottom;background-attachment: fixed;}--> </style> ■真ん中横一列に固定する
<style type="text/css"> <!--body{background-image: url(壁紙のファイル名);background-repeat: repeat-x;background-position: center;background-attachment: fixed;}--> </style> ■真ん中縦一列に固定する
<style type="text/css"> <!--body{background-image: url(壁紙のファイル名);background-repeat: repeat-y;background-position: center;}--> </style> ■右上に一個固定する
<style type="text/css"> <!--body{background-image:url(壁紙のファイル名);background-attachment:fixed;background-repeat:no-repeat;background-position:right top;}--> </style> ■右下に一個固定する
<style type="text/css"> <!--body{background-image:url(壁紙のファイル名);background-attachment:fixed;background-repeat:no-repeat;background-position:right bottom;}--> </style> ■左上に一個固定する
<style type="text/css"> <!--body{background-image:url(壁紙のファイル名);background-attachment:fixed;background-repeat:no-repeat;background-position:left top;}--> </style> ■左下に一個固定する
<style type="text/css"> <!--body{background-image:url(壁紙のファイル名);background-attachment:fixed;background-repeat:no-repeat;background-position:left bottom;}--> </style> ■右真ん中に一個固定する
<style type="text/css"> <!--body{background-image:url(壁紙のファイル名);background-attachment:fixed;background-repeat:no-repeat;background-position:right center;}--> </style> ■左真ん中に一個固定する
<style type="text/css"> <!--body{background-image:url(壁紙のファイル名);background-attachment:fixed;background-repeat:no-repeat;background-position:left center;}--> </style> ■上真ん中に一個固定する
<style type="text/css"> <!--body{background-image:url(壁紙のファイル名);background-attachment:fixed;background-repeat:no-repeat;background-position:top center;}--> </style> ■下真ん中に一個固定する
<style type="text/css"> <!--body{background-image:url(壁紙のファイル名);background-attachment:fixed;background-repeat:no-repeat;background-position:bottom center;}--> </style> ■ど真ん中に一個固定する
<style type="text/css"> <!--body{background-image:url(壁紙のファイル名);background-attachment:fixed;background-repeat:no-repeat;background-position:center;}--> </style> ■ページの好きな位置に一個固定する(サンプルは左から80%、上から60%)
<style type="text/css"> <!--body{background-image: url(壁紙のファイル名); background-attachment: fixed;background-repeat: no-repeat;background-position: 左からの距離% 上からの距離%;}--> </style> ■ページの好きな位置に一列縦に固定する(サンプルは左から80%、右から20%)
<style type="text/css"> <!--body{background-image:url(壁紙のファイル名);background-repeat:repeat-y;background-position:左からの距離% 右からの距離%;}--> </style> ■ページの好きな位置に一列横に固定する(サンプルは下から80%、上から20%)
<style type="text/css"> <!--body{background-image:url(壁紙のファイル名);background-repeat:repeat-x;background-position:下からの距離% 上からの距離%;background-attachment: fixed;}--> </style> 補足 ページをスクロールした時に、壁紙も一緒にスクロールさせたい場合は、 background-attachment: fixed;を消してください。 逆にスクロールした時に、壁紙は完全に固定してスクロールさせたくない場合は background-attachment: fixed;を入れてくださいね。 |