質問板

自分調べたのですがどうしても出来ません｡分かる方教えて下さい。body background="" bgproperties="fixed"は入れて見たのですがどうしても出来ません｡✉️

分かりました、そうですね､申し訳御座いません。また御手数とお時間お掛けして申し訳御座いませんでした。1から１０まで解説を付けて説明頂き、私でも分かるように時間を掛けて頂きまして本当にありがとうございます。優しい方に教えて頂けて幸いです。また自分で調べてみます、有難う御座いました。

ヤだよ
キミのここまでの態度だと、「要領を得ないキミの指示を心を砕いて解釈し、勉強する気のないキミの代わりに、他人の成果物のタダ乗りをする片棒をロハで担げ」って言ってるようにしか聞こえないしね

まずはチューターサイトを良く読みなよ

とはいえ、フツーはCSSファイルを別に作ることを推奨してるから……
「CSS styleタグ style属性書き方」とかで検索掛けてみなよ
コピペ脱却せんと「他人の成果物のタダ乗り」のままだよ

始めから全て直して頂いて有難う御座います｡どう此方の口から上手く説明して良いか分からず…。またどう上手く組んだら良いのか分からず他サイトから借りさせて頂いたのですが…。お手数お掛けしてしまってすみませんでした｡何度もお手数お掛けしてしまって再度のお願いに為ってしまって申し訳無いのですが、鍵部屋で1度スレッド試しに作ってみたいと思うので宜しければお手すきの間で構いません､ご指導頂けませんか?親記事にメルフォ置いておくのでもし気が向けば来て頂きたいです｡再度拝見しました､私の様な無知な者に対して全てに解説を付けて頂いてお時間頂いてしまい申し訳ありません｡何度も読み返しているのですが全てきちんと理解出来ているとは言えず…､まだ教えて頂けるのならばお願い出来ればと思います｡

>>22
> ほい、よーやっとおかしいトコ直し終わった……そもそも他のチューターサイトからのコピーで全然言う事聞いてないね、キミ
CSSで指定してるセレクタ「.wrap」と「.conts」がどちらもHTMLsource内にないんだもん、反映されるのはpへのpaddingだけだよね
divにclass="wrap"を持たせたものと、class="conts"を持たせたものをそれぞれ用意してみたよ
んでだ、何がおかしいかって……意味を考えずにサンプルをただ持ってきてるから、改行とかインシデント【行の頭を落として可読性を高めるアレのこったね】がまるまる残ってるんだよ
改行は全部投稿時にbrタグに置き換わるんだから、styleタグ内に混ざっちゃアカンでしょ
後、意味のない・デザイン的におかしな指示とかもね
無駄な空白も関数の引値おかしくしたりするから、とりあえず削っといたよ

.wrap {
margin: 30px;←これいる？marginは本来の表示領域（画面の左上）から始まるから、30ピクセル分だけ上と左に隙間ができちゃうよ？
}

.wrap::before {←コロン二連（::）で指す疑似要素のうち、beforeは「コンテンツのその前」の意味、だから以下の指示を全部.wrap内に納めちゃう　このままだと画面全体（先・後レスなどを含めて）を画像の下に敷いて隠しちゃうね
content: "";←スペースですらない空なら要らないよね
display: block;←他板はdisplayの文字列がNGなんだ
position: fixed;←「画面に対して固定」位置の意味だね
top: 0px;←その場所が上から0ピクセル
left: 0px;←左から0ピクセルから始まるよ、って言ってる
z-index: -1;←これ、他の要素との重ね合せの優先度=手前〜奥のどこに置くかを「－1」……ずっと奥だってことね
width: 100%;←%は使った場所で示す長さが変わるから気をつけてね、ここは問題ないけど
height: 100vh;←vhは「画面の高さ（100で一画面分）」上と合わせて指定した領域は「画面一枚分」っていう大きさだね
background-image: url(https://img.freepik.com/free-vector/watercolor-abstract-background_220290-24.jpg?w=1060&t=st=1709103970~exp=1709104570~hmac=fb0edebe8e8e7ddd929adc714e8e3f51e3ffba1fe634bc51d35ba1bebd192f85);←ちゃんと直リン可能なとこから貰ってきた？俺は知らんよ？
background-size: cover;←「指定した背景をどのくらいの大きさに広げるか」、今回は「縦横比を崩さず・領域いっぱいに隙間なく」の指定だね　縦横の長さ（ディスプレイのピクセルと画像のピクセル）の比によって縦横のどちらかが切れたりするよ
background-repeat: no-repeat;←領域の隙間を埋めるのに背景を繰り返すかどうか……だから、別に要らないね
}

.conts {
background-color: rgba(255, 255, 255, 0.8);
border-radius: 10px;←四ツ角を全部半径10ピクセルで丸めるよ
font-size: 40px;←フォントサイズは高さを参照するからね
text-align: center;
padding: 5%;←内側上下左右5%をパディング【文字の書かれない範囲】にするよ行数によって可変する上下もだから、実際に使うまでどのくらいの余地が出来るかは分からないよ
max-width: 800px;←領域の最大幅を800ピクセルに限定するよ　横長のフルＨＤモニタ・スマホ横持ちとかだと余裕で越えちゃうけど大丈夫？
margin: 0 auto;←四辺指定はパラメータ二つのとき、上下・左右の順で指定するよ　縦マージンが0、横マージンが自動ってことね
}

p {←セレクタ指定にclass・id等ないから、表示ページの全pタグのうち、class・idを指定してpaddingを定義していないもの全部に適用されるけど大丈夫？
padding: 20px;←パディングは20ピクセルを取るよ
}

Resources←これFirefoxでしか使わないんじゃなかったかな？しかももうサポート・推奨してなかった気がする
後にurl・パスを続けて、参照先を読み込んでおくとかそんなだったはず……まあ要らないね

んで、そのあたりを直したのがこちら↓

上記↑なにが間違ってて機能しないのでしょうか？

HTMLのタグとCSSの並べ方が良く分からずどう親記事に並べたら良いのか教えて頂けませんか?

背景固定　cssで検索すれば全て出てきます。調べた内容を流し見してませんか？内容きちんと読んでますか？

背景固定のコメント部分だけスライド出来る様なタグの方法知りたいです｡

自分で調べても分からないなら聞いてもきっと分からないですよ。

私の説明が悪くて申し訳ありません｡他の方のまるまる盗みたいというわけではなく､デザインの方法を学びたいのですが､文章で表現する事が出来ないため失礼ながら他の方のスレを挙げさせて頂ければとお伝えさせて頂いたつもりだったので､申し訳ありません｡

さて、ひょっとしたら……
全体の背景にはほにゃほにゃの画像を置いて、各コメント部分にはふにゃふにゃの画像を半透明で置きたい……たとえば、全体を木目調の複雑なパターンにして、コメント部分には焼印での焦がしみたいな下の木目がうっすら見えるまた別の複雑なパターンを乗せたいとか……ってことなのかな？

cssの方で画像の透過率を調整することはできないんだ
たとえば、今ココの背景になんらかの画像を指定したとして(アプロダ使いたくないんで割愛)、それが透過pngだったとしても、透過部分は背景(今なら緑赤青の→グラデ)をそのまま透かすし、非透過部分は背景とは全く関わらずに指定された色・形を表示しちゃう
pngの半透明の指定(アルファチャンネル設定)は……反映されたりされなかったり、ブラウザによってサポートが異なってたはずだ

もちろん、これに不満を持っている人は多くて、数年前に重なって表示されているはずのものにより高度な重ね合わせをするっていう機能が実装されてる
それがミックスブレンドモードmix-blend-modeだ
……ただ、コレはまだ勉強中で全然使い方が飲み込めてないんだよね笑

「これを真似したい」って言うのは如何なものかと……少なくとも俺は手を貸したくない
権利がどうとかいう以前にマナーの問題でね

「自分の中にあるものを形にするための技術を学びたい」っていうなら協力してあげたいけどさ
特にここの独自ルール(禁止ワードとかね)のお陰でできること・できないこともあるわけだし、知ってることを伝えるのはやぶさかじゃないよ

さて……
まずは↓でbodyのbackgroundにlinear-gradient……線形グラデーションだね……を指示してみるよ

↑()内のパラメータは順に角度(下から上が0deg、時計回りに360degで一周。他にもいろんな書き方があるよ)、#3c3から始めて、50%の所で#c33になって、最終地点で#33cになるよ、って意味だね
これをひとまず背景画像の代わりにしようか