css 特定のセレクタ以外に適用させる方法

ブラウザでの閲覧において、すべてのフォントを○○にしたいと云う場合がある。この場合、通常は以下のように記述すれば、すべてのセレクタに関して指定したフォントが有効になる。

* {
    font-family: ○○ !important;
}

しかしながら、これでは問題が生じる場合がある。それは、フォントによる絵文字を使用しているページである。このようなページでは、絵文字が所謂 ”豆腐” □ になってしまうのである。このような問題を回避するためには、絵文字フォントのセレクタでは、フォントの指定が無効になるように制御する必要がある。

:not(.icon):not(.icon_font):not(i) {
  font-family: ○○ !important;
}

上記の場合は、クラス名 [icon] , [icon_font] と セレクタ [i] が、 [font-family ...] 適用外となる。

クラス名に [icon] 文字列を含む場合すべてなら :not([class*="icon"]) としてもよい。

どのセレクタが使用されているか?は、ブラウザの ”要素の調査” を利用すれば簡単に調べることができる。 ↓ Firefoxでの事例。

58_001.png

このように対応すれば、自分の好みにあったフォントですべてのページの閲覧が可能となるワケである。

admin
カテゴリ:ブラウザ
タグ:CSS フォント
2017/01/12 17:44 | コメント (0)
◎この記事へのコメントは 0 件です。コメント欄を表示しますか?
コメントを書く
お名前: [必須入力]

メールアドレス:

ホームページアドレス:

コメント: [必須入力]

カテゴリ
最近のコメント
2017-10-25 管理人
翻訳URL Google と Bing
2017-10-25 石川通隆
翻訳URL Google と Bing
2017-10-15 管理人
人参の ”おじや”
2017-10-15 石川通隆
人参の ”おじや”
※ご質問等、管理人の返信が必要な場合は、その旨お書きください。
このブログについて
jkun-400x400.jpg インターネット, パソコン, スマホ, Windows, Linux, Android, 各種アプリ, ブラウザ, ブラウザ拡張機能, 携帯電話, 社会情勢, 韓ドラ, K-POP 関連の話題を取り上げます。ジャンルとしては幅広く、特定のカテゴリに特化したブログではありません。お時間がありましたら、どうぞお立ち寄りくださいませ。
筆者プロフィール