[CSS] ダークモードを有効化しない方法
背景
Adobe Acrobat の Chrome 拡張のバグによって、端末がダークモードの設定をしている場合にウェブサイトのダークモード指定を強制する不具合が発生していた（既に修正済み）。具体的にはbackground-colorが指定されていない要素の背景色が本来は白であることが期待されるところをダークモードの強制によって黒色になってしまうというもの。
この意図しない表示結果を正しくするための検証をした。
方法
カラースキームの指定には、HTML もしくは CSS を利用する方法がある。
指定できる値
normal- デフォルト値dark- ダークモードのみのサポートlight- ライトモードのみのサポートdark light- ダークモードとライトモードをサポートしており、ダークモードが優先されるlight dark- ライトモードとダークモードをサポートしており、ライトモードが優先される
HTML で指定する方法
<meta name="color-scheme" content="light" />
CSS で指定する方法
:root {
color-scheme: light;
}
検証時、拡張機能がcolor-scheme: light dark !importantを挿入してきていたため、color-scheme: light !important;を指定して上書きし直した。