背景画像固定する方法

こんにちわ！

CSSは苦手ですが、頑張っております！

背景画面を固定する方法です。（PCのみスマホiOSは効かない）

以下、サンプルコード

<html>
<head>
<style>
 div.sample1, div.sample2 {
    width: 90%;
    height: 600px;
    overflow: auto;
    margin-bottom: 1.5em;
    border: 2px #000 solid;
    background-color: #ffffff;
    background-image: url(https://yam-lab.com/ssssss/s11/img/bg.jpg);
    color: #000000;
 }
 div.sample1 { background-attachment: fixed; }
 div.sample2 { background-attachment: scroll; }
</style>
</head>
<body>
<h1>背景画像固定する方法</h1>
<hr>
<div class="top">
  <div class="sample1">
    <p>fixed(背景画面固定あり)</p>
  </div>
  <div class="sample2">
    <p>scroll(背景画面固定なし)</p>
  </div>
</div>
</body></html>

デモサイト

自分のTOPページにも反映してみました！

ヤマラボ

ではまた！

背景画像固定する方法