[過去ﾛｸﾞ] HTML/CSS のどんな質問にも優しく答えるｽﾚ 52 (1002ﾚｽ)
上下前次1-新
このｽﾚｯﾄﾞは過去ﾛｸﾞ倉庫に格納されています｡
次ｽﾚ検索 歴削→次ｽﾚ 栞削→次ｽﾚ 過去ﾛｸﾞﾒﾆｭｰ
372: 2024/02/11(日)06:12 ID:??? AAS
ユーザー自身が拡縮する分は
こちらの想定外でいいと思う
373: 371 2024/02/11(日)14:01 ID:??? AAS
サンクス
374: 2024/02/18(日)14:35 ID:??? AAS
人のSassのソースを見る機会があったんですが
以下のA・B、どっちが主流ですか？
Bで書くことが多いのでAのメリットはなんでしょう？
Aの書き方
.hoge {
width: 100px;
@media (min-width: 1080px) {
width: 200px;
}
…
省10
375: 2024/02/18(日)15:17 ID:??? AAS
Aは同じセレクターの状態違いだとわかる
Bはもうsassの意味がないレベル
376: 2024/02/18(日)15:21 ID:??? AAS
ありがとうございます
SP作ってからPC版を作成ってクセが
個々にメディアクエリを書くより楽なもので
377: 2024/02/18(日)15:32 ID:??? AAS
メディアクエリをmixin化するのだ
ひとつセレクタがあったら
.hoge{
@include mixin.media(sp){
}
@include mixin.media(tab){
}
@include mixin.media(pc){
}
}
省2
378: 2024/02/18(日)15:34 ID:??? AAS
なるほどー
mixinを使うと元を修正するだけで済むから汎用性がますんですね
アドバイス助かります
379(1): 2024/02/18(日)16:54 ID:??? AAS
Scssは横幅毎にファイル分けてだけどおかしなやり方だったんかなぁ
380(1): 2024/02/18(日)17:22 ID:??? AAS
>>379
見通しがよければなんでもいいと思うけど
同じセレクターというか同じものを指す記述が何カ所にも登場するとそれだけでclass名の変更があったときなどに置き換える箇所が増えて変更に弱くなるよね
これは&使わない教にも言える
他方、親セレクタひとつ変えれば子孫や状態変化すべて変えられるような変更に強いコードは
hoge__fuga みたいなHTML上のセレクタそのもので全文検索しても見つからないので
hoge の中から探すか、ソースマップ必須になる
どちらが保守性が高いと言えるかはプロジェクトの規模やチームの特性によって変わりうる
381: 2024/02/18(日)18:41 ID:??? AAS
>>380
なるほど変更修正も考えて分かりやすくって事ですね
382(1): 2024/02/29(木)18:15 ID:??? AAS
div.hogeに以下のようなcssを効かせました
hoge{
position:relative;
}
hoge::after{
position: absolute;
bottom: -20px;
right: -20px;
display: block;
width: 100%;
省8
383: 2024/02/29(木)18:40 ID:??? AAS
>>382
hogeの中にインナーを作る
z-indexが インナー>hoge::afterになるようにする
というか影つけるだけなら疑似要素なんかいらなくて
hogeにbox-shadowであかんの
384: 2024/02/29(木)18:44 ID:??? AAS
ありがとうございます
after要素が透明ありのpngなんで、filterなんです
どうもz-indexへの愛と理解が足りてない。。
385: 2024/02/29(木)18:48 ID:??? AAS
疑似要素にcontentでpngを入れてるなら素直にimgタグ書くべき
背景画像がpngという意味ならdrop-shadowきかない
386: 2024/02/29(木)18:51 ID:??? AAS
背景パターンなのでpngをBGに使っています
filter drop-shadow自体は効くようですが
chromeで見ただけなので効かないのもあるんですか
検証します ありがとうございます
387: 2024/02/29(木)19:11 ID:??? AAS
お騒がせしました
after要素に問題なくdrop-shadowが付いてました
なにも書き換えてないと思うのですが
388(1): 2024/03/10(日)12:29 ID:vNGHzsx+(1) AAS
3DCGのweb表示をしたいと考えています。
最初はThree.jsでやってたのですがGPU使用率が多く、試行錯誤して
今はmodel-viewerで試行錯誤しています。
model-viewerはモデルが動いてないとGPU使用率も0になるのでいいかとおもったのですが、
表示して暫く触らないと勝手にポインタが出てきてモデルを左右に振ってみせて、
動かせることを主張してきます。これのせいでGPU使用率が上がってしまいます。
この、勝手にポインタが出てくる仕様をOFFにできないでしょうか。
外部ﾘﾝｸ:008.server-test.space
389(1): 2024/03/10(日)17:49 ID:??? AAS
ドキュメント読んでみたけど、そんな設定無さげ
390(1): 2024/03/10(日)22:18 ID:??? AAS
>>388
interaction-prompt="none"でいいんじゃねえの？
外部ﾘﾝｸ[html]:modelviewer.dev
念のためググってみたら日本語情報も出てきたし
外部ﾘﾝｸ:mawasu-blog.com
391: 2024/03/11(月)00:12 ID:??? AAS
>>389
ありがとうございます。お手数をお掛け頂いて感謝であります。
>>390
ワオ！すごい！まさに！そのブログもいくつか目を通したのですがそこは読み飛ばしてました。
感激であります！！！！１
上下前次1-新書関写板覧索設栞歴
あと 611 ﾚｽあります
ｽﾚ情報 赤ﾚｽ抽出 画像ﾚｽ抽出 歴の未読ｽﾚ AAｻﾑﾈｲﾙ
ぬこの手 ぬこTOP 0.011s