HTMLタグのデフォルトCSSを指定したタグだけ全て無効にする方法【allプロパティを使おう】
HTMLタグのデフォルトCSSを指定したタグだけ全て無効にしたい。
本記事ではこのような悩みを解決。
実装例を元に解説します。
実装サンプル
See the Pen
デフォルトCSSを削除 by Kohei (@kouk05)
on CodePen.0
実装サンプルです。
左がデフォルトCSSが機能してるbuttonタグ。
右がデフォルトCSSを無効にして、オリジナルCSSを充ててるbuttonタグになります。
一つのあるプロパティを付与する事で、デフォルトで付与されるCSSプロパティを全て無効にしてます。
実装方法は以下の通りです。
allプロパティでデフォルトCSSを無効にする
無効にしたいHTML要素 {
all: unset;/*デフォルトCSSを無効*/
}
デフォルトCSSをHTMLタグ事に無効にしたい場合は、allプロパティを使用します。
値にunsetを適用する事で、デフォルトCSSを無効。
プロパティを初期化してくれます。
以上で解決です。
まとめ
allプロパティを使って、HTMLタグのデフォルトCSSを指定したタグだけ全て無効にする方法について紹介しました。
以上で解説を終わります。
目次
