CSSで要素を隠す10の方法
(sitepoint.com)互換性、アクセシビリティ、レイアウト変更の有無、アニメーション、イベントハンドリング、パフォーマンスの観点から見ていく
-
opacity, filter:opacity()
-
color のアルファ
-
transform
-
clip-path
-
visibility
-
display
-
hidden
-
position
-
overlay ::after
-
width、height を縮める
互換性、アクセシビリティ、レイアウト変更の有無、アニメーション、イベントハンドリング、パフォーマンスの観点から見ていく
opacity, filter:opacity()
color のアルファ
transform
clip-path
visibility
display
hidden
position
overlay ::after
width、height を縮める
1件のコメント
私はほとんど
display:noneを使っていたので、ここまでやる必要があるのかと思っていましたが、レイアウトを維持したまま見えなくする部分はいいですね。
そう考えると、互換性の高い5番や3番も活用度が高そうです