Почему мое свойство "font-family" не наследуется?

мой код:

body {
    font-family:"Verdana",Arial,Helvetica,sans-serif;
}
.myfont {
    font-family:"Verdana",Arial,Helvetica,sans-serif;
}
<body>
    Hello
    <select>
        <option>
            Hello
        </option>
    </select>
    <select class="myfont">
        <option>
            Hello
        </option>
    </select>
</body>

почему первый <select> элемент не наследует font-family свойство из спецификации <body>?

если мне нужно изменить шрифт на <select> почему я должен копировать стиль?

4 ответов


Если вы используете:

select {
  font-family: inherit;
}

это будет работать нормально. CSS немного причудлив, когда дело доходит до элементов управления формой.


Yes font-family: наследовать кажется лучшим.
А иначе:

  body, .myfont
  {
    font-family:Verdana,Arial,Helvetica,sans-serif;
  }

вы можете также заменить.myfont " для "select", если вы хотите, чтобы все элементы select использовали это.

горячий кончик. Не используйте кавычки вокруг ваших фамилий шрифтов, это не понимают все браузеры.


если мне нужно изменить шрифт на "выберите" почему я должен скопировать стиль?

просто чтобы вы знали, даже если вам нужно было "скопировать стиль", вам не нужно скопировать стиль, как вы сделали выше.

вы просто примените стиль samy к body и .myfont при этом:

      .myfont, body 
      {
        font-family:"Verdana",Arial,Helvetica,sans-serif;
      }

ответ Джеймса кажется мне самым элегантным и правильным, но я подумал, что просто добавлю еще один способ сделать это:

.myfont option {
     font-family: "Verdana"; /* etc */
}