ホームページ > ウェブフロントエンド > CSSチュートリアル > 「Input」要素が「Body」からフォントを継承しないのはなぜですか?

「Input」要素が「Body」からフォントを継承しないのはなぜですか?

Mary-Kate Olsen
リリース: 2024-10-28 02:24:30
オリジナル
511 人が閲覧しました

Why Doesn't My

本文からフォントを継承しない入力

CSS を使用して HTML 要素のスタイルを設定する場合、特定の要素がスタイル プロパティを継承しない場合があります。予想通り。これは、デフォルトでは親要素から font-family プロパティを継承しない入力フィールドの場合に当てはまります。

この例では、CSS ルールは、両方の要素に対して特定のフォント ファミリを定義するように設定されています。 body 要素とカスタム クラス adm は、label 要素と input 要素の両方に適用されます。ただし、Firefox では、入力フィールドのフォントがラベルのフォントと一致しません。

これを解決するには、CSS を使用して入力フィールドが親要素からフォントを継承するように明示的に指定できます:

<code class="css">input, select, textarea, button {
  font-family: inherit;
}</code>
ログイン後にコピー

このルールを追加すると、入力フィールドは body 要素で定義された font-family プロパティを継承し、ページ上の残りのテキストと同じフォントが使用されるようになります。

これは、デモ http://jsfiddle.net/gaby/pEedc/1/ を表示することで確認できます。

以上が「Input」要素が「Body」からフォントを継承しないのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート