Как установить стиль шрифта для веб-страницы в одном месте, не изменяя таблицу стилей агента пользователя - PullRequest
0 голосов
/ 17 апреля 2020

Я хотел бы использовать CSS в одном месте, чтобы указать стиль шрифта везде на моей веб-странице. Я попробовал следующее:

  body{
  font-family: 'Roboto', sans-serif;
  margin-top: 30px;
  background-color: #dfeff0;}

У меня есть несколько форм на веб-странице с некоторым вводимым текстом по умолчанию. Я заметил, что стиль ввода текста в формах переопределяется таблицей стилей агента пользователя. Это имеет смысл, поскольку значение по умолчанию CSS для поля ввода текста является более точным c, чем CSS, который я указал для моего элемента body. Я могу изменить текст в поле ввода на свой предпочтительный стиль, написав еще одну строку CSS, специально предназначенную для поля ввода, однако это кажется плохой практикой, поскольку нарушает принцип DRY. Когда моя веб-страница становится больше, я представляю, что во многих местах будет написано одно и то же правило стиля текста, поскольку я продолжаю "бороться" со стандартным значением CSS.

Есть ли способ написать CSS код, который является одновременно общим (применяется ко всем элементам) и защищен от переопределения более специфичным c значением по умолчанию CSS? Каковы лучшие практики для ситуации, которую я описываю.

Вот форма, на которую я ссылаюсь, на случай, если она уместна.

<form action="" method="">
      <input id="task-field" type="text" name="task_contents" value="... (enter a task)">
      <input id="start" type="text" name="start_time" value="Start Time">
      <input id="duration" type="text" name="task_duration" value="Duration">
      <label for="all_day_task">All Day Task</label>
      <input id="all-day" type="checkbox" name="all_day_task">
      <label for="all_day_task">All Day Task</label>
      <input id="long-term" type="checkbox" name="long_term_task">
    </form>

1 Ответ

1 голос
/ 18 апреля 2020

вы можете использовать * тег, чтобы сделать все элементы

 * {
  font-family: 'Roboto', sans-serif ;

}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...