2008年08月19日

背景画像を固定 background-attachmentプロパティ

スポンサード リンク

background-attachment :fixed; を使ってこのブログの背景を
固定してみました。

seesaaブログ場合はマイ・ブログ→デザイン→デザイン一覧
と入っていきます。デザイン一覧の下の方に利用している
デザインが表示されてます。タイトルのデザイン名のリンクを押すと
下の画面のような現在のスタイルシートが表示されます。

 
スタイルシート ?

body {
background-image:url(http://blog.seesaa.jp/img/bg/heart/bg.gif);
background-attachment : fixed; //このコードを挿入
background-repeat:repeat;
margin:0px;
padding:0px;
text-align:center;
font-family:Verdana;
}

#container{
margin:0px auto;
width:800px;
border:solid #000;
border-width:0px 1px; color:#666; font-size:12px; font-family:Verdana;
text-align:center; background:#fff;
}

長くなるので以下省略

スタイルシートの変更はすごく簡単です。
body { body要素のスタイル設定部分の
background-image:url(http://blog.seesaa.jp/img/bg/heart/bg.gif);
背景画像の指定の後に background-attachment : fixed; を追加するだけです。

background-attachment : fixed; //固定してスクロールしません。
background-attachment : scroll; //画面がスクロールすると背景画像もスクロールします。

ホームページの場合は
<STYLE TYPE="text/css">
<!--
BODY {
background-image:url(背景画像);
background-attachment : fixed;
}
-->
</STYLE>

で背景画像を固定することができます。

posted by javaScript at 18:48 | 大阪 ☁ | Seesaaブログ カスタマイズ | このブログの読者になる | 更新情報をチェックする
×

この広告は1年以上新しい記事の投稿がないブログに表示されております。