TOP

背景画像を動作しないようにするCSS指定

サイト背景の全体画像化が完了しましたら、次は画面をスクロールしてもノンストップ
動かなくする指定をしましょう

 

この指定をやらないと、スクロールに従い背景が上に移動してしまい、残された
記事だけ見ても、超いまいち不思議なサイトになってしまいます

 

指定手順は、超簡単

 

背景を動かさないという指示コードをスタイルシートでCSS指定するだけ

 

こちらがそのコードです
background-attachment:fixed

 

どこに取り付けるか?

 

まずは、スタイルシート開きまして、基本スタイルの下、body項目へ到達

 

例記載で色違いコードを確認してください
==================================================
基本スタイル
==================================================
*/
body {
background-color: #fff;
border-top: 4px solid #fff;
color: #FFF;
font-family: 'メイリオ', Helvetica, 'Hiragino Kaku Gothic Pro', sans-serif;
font-size: 15px;
line-height: 180%;
text-align: center;
letter-spacing: -0.001em;/* iOS4でのテキストの隙間への対応 */
-webkit-text-size-adjust: 100%;/* 文字サイズの自動調整機能のキャンセル */
background-attachment:fixed 追加した例
}

 

 

以上で完了です

 

ですが、

 

これで、終わりません

 

上記、の指定が環境により反映されない場合があるのです

 

その場合は、次のリンクページに詳細を追記しております
サイト背景画像がPC画面で寸足らずでもCSSでフィットする方法

 

 

背景画像をスクロールオンでもノンストップ指定するCSSコード
トップページ