Обычно вы вставляете css, который зависит от страницы. Вот как я делаю свою CSS:
Глобальный CSS (отдельный файл (ы)):
<link type="text/css" rel="stylesheet" href="css/style.css" media="all" />
ПРИМЕЧАНИЕ: В современном мире веб мы используем кучу плагинов/тем и эти плагины/темы, как правило, развертывают более новые версии, поэтому, когда вы переопределяете эти плагины/темы, обязательно создайте файл css, специфичный для этой темы.
Например,
Bootstrap 3,1
<link href="/css/bootstrap.3.1.css" rel="stylesheet" type="text/css">
Создать это для всех ваших бутстраповских переопределениях, так что вы можете использовать последнюю версию, когда она выйдет.
<link href="/css/bootstrap.overrides.css" rel="stylesheet" type="text/css">
Page конкретные C (встроенный):
<head>
<!-- last element in head //-->
<style type="text/css">
.pageSpecific
{
color: red;
}
</style>
</head>
Когда я нахожусь в стадии разработки или HTML элемент не требует классификации CSS.
Простой формат стиля (встроенный):
<th style="min-width: 65px;">Column Header</th>
Вы можете иметь печати конкретные CSS, а также:
<link href="/css/print.css" rel="stylesheet" type="text/css">
и внутри этого файла обернуть CSS, как, например:
@media print{
<!-- print specific css here//-->
}
Имейте в виду, что вы можете использовать css classifcation позже, когда это может показаться специфичным для страницы. Всегда используйте код для повторного использования!
Наконец:
Мне нравится использовать css minifier, когда я кладу файл (ы) в производство.Я делаю то же самое с файлами javascript, используя UglyJs. Существует также LESS css, который вы можете использовать, но на данный момент я придерживаюсь этих простых соглашений или чего-то подобного.
Почему вы используете 'media = all'? Для этого редко бывает никаких оснований. Почему ваш CSS должен быть отправлен на брейк-ридер? Или печатать? Почему бы просто не использовать 'media = screen, tv, projection', так как это действительно полезно для видимого CSS? (Да, я знаю, что 'tv' и' projection' возвращает ошибку проверки - это почти не имеет значения, поскольку валидатор, похоже, забывает киоск-режим, летные ЖК-дисплеи и множество других экранов, которые не прилипают к «экрану») , – junkfoodjunkie
Какова штраф за использование этого вместо '@media screen'? Я хочу, чтобы мой css переносился на мой print css, и в случае необходимости я переопределяю правила '@media print'. Думаю, я мог бы поставить «экран, печать», но опять же, каков штраф? – yardpenalty
Нет штрафа, но обычно довольно много CSS, используемых для экрана, не принадлежит к печати. Обычно используется совершенно отдельный print.css, просто потому, что на обычной веб-странице много контента, который не имеет ничего общего с печатью - например, фоновые изображения, охватывающие страницу, и так далее. Форматирование часто также не особенно подходит для экрана и печатных страниц, а также для других элементов, которые вы можете скрыть или подчеркнуть по-разному. Конечно, это немного зависит от сайта, но в большинстве случаев экран CSS бесполезен в печати, и наоборот. – junkfoodjunkie