このスレには以下のCSSが適用されてます。
<style type="text/css">body{background-image:url(フリー素材の背景画像);background-size:100%;background-attachment:fixed;
}div#wrapper{font-size:0.85em;color:#ffffff;box-sizing:border-box;width:96%;margin-top:20px;margin-bottom:20px;padding:10px;text-border-radius:20px;background:#777777;opacity:0.7;}</style>
ソース解析で、wrapperというIDのdiv要素があったので、それを利用して枠を設定しています。
▷
パターン・テクスチャ背景のサンプル質問板に戻る各要素の説明(わかりやすいのだけ)
body{background-image: url(ここに画像URL);→全体の背景画像
font-size:0.85em;→全体の文字を0.85倍
color:#ffffff;→文字色(色コード)
background-attachment:fixed;→背景画像を固定
border-radius:20px;→枠の角の丸みのサイズ
background: #777777;→枠内の背景色
opacity:0.7;→枠内の透過率(70%)
LINEの着せかえみたいな感じで気軽に背景変えられたら面白いかなーと思ったけど、やっぱりちょっと複雑か…
この書き方だとwrapper内の全てにopacity:0.7が掛かるので、文字要素や広告、ひいてはimageで貼り付けした画像なんかも透過しちゃうよ〜
wrapperの背景だけ透過させるなら、wrapperのbackgroundを透過色にするべきじゃないかな〜
>>3このCSSを理解できでる人は知ってるよ。余計なお世話言いたいオッサンかい?
コレ、スレ一覧ってとこからじゃなくて親記事から囲むバージョンありませんか?
質問失礼します。こちらのページの背景が固定になっていないのですがスマホから見ているからでしょうか?
スマホでも固定なってますよ?Androidでバージョン15の端末でブラウザはChrom
こちらiPhone iOS18.6.2 Chromeで見ているのですが背景固定にならず繰り返し表示されます。iPhoneに対応していないタグなのでしょうか?
iPhoneならsafariが相性いいと思いますよ。端末によってというよりブラウザの影響なので、Chromのブラウザも最新に更新したら変わるかもしれませんね。
ありがとうございます。Safariから見ても繰り返しだったのでChromeを試したのですが改善されず。アプデも確認したのですが最新だったので諦めます。
ということは問題はiOSか…、解決できずすみません🙇
とんでもないです。優しいお声掛けありがとうございました。