HTML/CSS のどんな質問にも優しく答えるｽﾚ 52 (986ﾚｽ)
上下前次1-新
220(1): 2023/10/15(日)23:19 ID:??? AAS
自分なら売り切れ商品は非表示ではなく
phpでDBから引いてくるときにDOM自体除外するなあ
221: 2023/10/16(月)02:07 ID:??? AAS
取り扱ってすらいないのかわからない状態にするってこと？
222: 2023/10/16(月)03:23 ID:??? AAS
見た目だけじゃなくてDOMも消すって話
売り切れも含むみたいなチェックがオンなら売り切れ中であることを明示して再生成する
223(2): 2023/10/16(月)03:40 ID:R+2RS1w5(1) AAS
##.style_td:has-text(ビーム):style()
##[class="style_td"]:has-text(ビーム):style()
↑これらが同じ効果を与える環境です
class値に~=や^=で制御し、適用されるテキストを差別化するのは慣れているのですが、
class値が全く同じで「ビーム」単体のみではなく「ビーム砲」や「拡散ビームなんちゃら」等、ビームという単語を含む一文すべてに反応してしまう現状
:has-text()が"この文字列を含む"という効果なので当然の結果です
それを、~=のように"この文字列だけ"や^=のように"この文字列から始まるものだけ"と指定する方法はないでしょうか？
よろしくお願いいたします
224: 2023/10/16(月)07:46 ID:??? AAS
>>220
俺もこれだな
diaplay none付けて非表示にする商品は最初からHTMLに出力しない
どれだけSEOに効果あるのかは分からないけどHTMLのデータ量が少ない方がCWVのスコアがいいしね
225: 2023/10/16(月)13:01 ID:??? AAS
>>223
CSSに:has-textなんて疑似クラスは無いのでスレ違いだし、よく分からんので意図通りに動くかは知らんが
()内で正規表現使ってダメなら、adblock系のスレで質問した方がいいんじゃないかと
226: 2023/10/16(月)15:20 ID:??? AAS
has擬似クラスはいつになったらFirefoxで使えるようになるんだろ
227: 2023/10/16(月)15:28 ID:??? AAS
:hasみたいなのあればいいな（jsのcladdList.containsみたいなことやりたいな）としょっちゅう思ってたはずなのに
実の所 :not と :isで事足りているのはある
228(1): 2023/10/16(月)18:42 ID:UcrE7pLb(1) AAS
皆さんでしたら、一つのタグ内である特定の文字列だけを色変更する場合、どのように記述しますか？
例えば
〜.com##.style_td:has-text(ビーム):style(color:#00ccff!important;)
とすると、そのサイトのclass値がstyle_tdのタグ内でビームという文字列を含んだ場合、現状ではタグ内にあるビーム以外の文字列も全部#00ccffカラーへ置き換えられます
「ビームという文字列が含まれたstyle_td」が:style()の対象にされるため、です
それを、ビームの部分だけ#00ccffカラーに変更したい
229: 2023/10/16(月)20:04 ID:??? AAS
だからそれcssじゃねーだろ
失せろ
230: 2023/10/16(月)21:02 ID:??? AAS
いつものスレチｸｿに構うな
231: 2023/10/16(月)23:05 ID:??? AAS
displayつながりならよくね？
結局パフォーマンス問題でレンダリングさせるさせないに行き着くわけだし
232: 2023/10/17(火)00:40 ID:??? AAS
NGしてて見えないのかもしれないが、>>223,228みたいなのはAdBlockスレでやる話やね
Web制作でのCSSの話じゃないし
233(1): 2023/10/22(日)14:26 ID:??? AAS
borderのdashedって
破線の長さ、間隔をCSSで設定することはできませんよね？
Figmaが線の「高度な設定」内で破線と間隔指定できるので
なにか対策あるのかと思いまして
234(1): 2023/10/22(日)14:42 ID:??? AAS
border-styleじゃ無理なのでbackground-imageで再現するみたいだよ
235: 2023/10/22(日)14:50 ID:??? AAS
>>234
ありがとうございます！
やっぱりそうなんですね ひと手間かけるんですね 角丸どうしよう
236(2): 2023/10/22(日)14:55 ID:??? AAS
>>233
figmaでできるなら
figmaの開発者モードでどんなCSS吐き出してるか見ればよいのでは
237(2): 2023/10/26(木)15:05 ID:??? AAS
>>236
レスついてたの気がつきませんでした
開発者モードでは
border: 1px dashed var(--Grey, #666);
となっているだけで、破線と間隔指定の記載は見当たらないのです
238(2): 2023/10/26(木)16:59 ID:??? AAS
>>237
CSS Trick – Customized Dashed or Dotted Border
外部ﾘﾝｸ:kovart.github.io
239: 2023/10/26(木)17:11 ID:??? AAS
>>238
わーーー、すごい！！ありがとうございます！！
border imgではなく
background-imageで作るんですね
ブックマークします
上下前次1-新書関写板覧索設栞歴
あと 747 ﾚｽあります
ｽﾚ情報 赤ﾚｽ抽出 画像ﾚｽ抽出 歴の未読ｽﾚ AAｻﾑﾈｲﾙ
ぬこの手 ぬこTOP 0.009s