HTML/CSS のどんな質問にも優しく答えるスレ 52 (889レス)
1-

280: 275 2023/12/11(月)22:24 ID:??? AAS
分かりました
レスくれた方、ありがとうございました
281: 2023/12/12(火)01:07 ID:??? AAS
俺は3派
282: 2023/12/12(火)04:06 ID:??? AAS
最近のエディタはその辺の事情酌んで事後の扱いが自由になってるから助かる
俺はTab派
283: 2023/12/18(月)12:41 ID:??? AAS
HTMLの表示に何のフォントが使われているかを確認するためにWhatFontという
ブラウザの拡張を入れたのですが、フォントがserifやsan-serifの場合にそれが
実際に何のフォントなのかを確認する方法はあるでしょうか?

本来論理的なフォント名にしてそういう詳細にこだわらないというものなのでしょうが、
その他のフォントとの兼ね合いやOS等による違いを一応把握しておきたいのです
284
(1): 2023/12/18(月)12:46 ID:??? AAS
chromeのdevツールのComputedの一番下にRendered fontsがあるじゃろ
285
(1): 2023/12/18(月)13:38 ID:??? AAS
firefoxも開発ツールの右ペインにフォントタブがある
286: 2023/12/20(水)00:23 ID:??? AAS
Firefox121、規定で:has()有効になったね
287: 2023/12/21(木)16:48 ID:??? AAS
>>284 >>285
できました、どうもありがとうございます
288: 2023/12/22(金)14:38 ID:??? AAS
画像にcssでfilter drop-shadowで影をつける際に
影だけ乗算を適用させることってできますか?
289: 2023/12/22(金)21:40 ID:??? AAS
drop-shadowとmix-blend-mode用に::beforeで同サイズのblockを画像の下に重ねるとか?
乗算ならberforeのblockにbackground-color: white;入れとくといいかも
290: 2023/12/22(金)22:02 ID:??? AAS
画像が矩形じゃなくて透過で形通りの影を乗算にしたいとかなら無理じゃねーかな
291: 2023/12/22(金)22:08 ID:??? AAS
矩形の画像ならdivの背景にしておいて、後ろに乗算で同サイズの擬似要素を追加すればできる
背景抜いた画像は擬似要素のcontentに同じ画像を指定すればいける
ただしサイズ調整が利かないのでレスポンシブ使用には厳しい

手間の割に効果は薄いので、自分なら乗算は使わずそれっぽく見える透明度に調整するかな
イラレとかだとデフォが乗算になってるだけで、デザイナーがどうしても乗算を要求するってケースは少ないし
292: 2023/12/23(土)10:02 ID:??? AAS
288です
ありがとうございます! おっしゃる通り矩形ではなく透明のあるpng画像です
擬似要素に同じ画像ってのは考え付かなかったです
それでできるか試してみます!
293
(1): 2023/12/24(日)15:43 ID:??? AAS
filter dropshadowをかけた要素内でposition fixedが効かなくなる
バグ(?)に初めて出会った
SafariだけOKでChrome、Edge、FFがNG
Safariの挙動が正しくないのかな
294: 2023/12/24(日)20:49 ID:??? AAS
ホントだ
ChromeもFirefoxも、親にfilter使った途端に子がabsoluteの挙動になるね
これはWebkitの方が正しいんでない?
295: 01/02(火)01:34 ID:??? AAS
>>293
外部リンク:developer.mozilla.org
>固定位置指定は絶対位置指定に似ていますが、要素の包含ブロックがビューポートによって
>定義される初期包含ブロックであるという点が異なり、祖先の一つに transform, perspective, filterの
>何れかのプロパティが none 以外 (CSS Transforms Spec を参照) に設定されている場合は例外で、
>その場合は祖先が包含ブロックとしてふるまいます。

まあいつもの通りでSafariが悪い
296: 01/02(火)19:30 ID:??? AAS
開発側にとっては謎仕様やな
297: 01/02(火)22:07 ID:??? AAS
謎でもないと思うぞ
transformやらが親要素に効いてるのに子要素がfixedだと、親とは全く無関係な位置に配置されちゃうから
transformの効果をどう処理したらいいのか解釈があいまいになっちゃうだろ
そういうややこしいことが起こらないように、fixedさせたいならなるべくbody直下に置いておけという
仕様になってもそれは妥当なんじゃないか
298: 01/03(水)01:39 ID:??? AAS
fixed要素はルート直下の設置がいいのは同意だけど、filterやtransformで動作が変わるってのは納得いかないな
Webkitの実装の方が直感的だと思うわ
まあその辺は散々議論された上でこの仕様なんだろうけど
299: [kotomitanaka1021@gmail.com] 01/03(水)14:00 ID:??? AAS
初歩的な質問ですみません
画像の位置とテキストの位置ってどうやって調整するんですか?
どこかと揃えたいんじゃなくて位置を変えたいです。お願いします
1-
あと 590 レスあります
スレ情報 赤レス抽出 画像レス抽出 歴の未読スレ AAサムネイル

ぬこの手 ぬこTOP 0.012s