Будет ли встроенный стиль иметь приоритет над медиа-запросом?

У меня ранее была построена электронная почта с html и встроенным css. Недавно я решил добавить медиа-запросы, чтобы сделать их более мобильными. Однако мне было интересно, будет ли стиль inline-styling (css) иметь приоритет и медиа-запрос.Будет ли встроенный стиль иметь приоритет над медиа-запросом?

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

Спасибо!

источник

2016-01-15 Steez

Когда вы определяете встроенный стиль, он доступен для всех устройств и любого набора медиа-запросов, которые вы пишете.

И встроенный стиль имеет наивысший приоритет, поэтому в вашем случае стилизация отображения будет иметь встроенные стили.

Если вы хотите переопределить встроенные стили, вам необходимо добавить стили в свои медиа-запросы, используя !important.

Для справки - CSS Specificity

источник

2016-01-15 18:04:58 nikhil

Ответил также на этот вопрос, но этот ответ покрывает его. Вот пример JSFiddle, который я сделал, показывая это: https://jsfiddle.net/26xgnw7b/ – Aeolingamenfel

То же. Я также хотел бы упомянуть об этом, поэтому следует избегать как можно большего числа встроенных стилей. Вызов '! Important' для переопределения встроенных стилей является супер уродливым и может привести к проблемам. –

@Aeolingamenfel - Спасибо за пример. Это будет хорошей ссылкой для Steez. – nikhil

Когда браузер потребляет вашу страницу, он потребляет его как поток текста. Сначала будут встречаться ваши теги <script> и <link>, а затем загружать и выполнять файлы JavaScript и/или CSS. Затем браузер перейдет к потоку на ваш <body>. Если у вас есть встроенные стили, страница должна быть перерисована браузером b/c, теперь она столкнулась с новым CSS внутри HTML. Inline-стили принимают наивысший приоритет и обычно их следует избегать, но они будут перезаписывать то, что находится в ваших внешних файлах CSS.

источник

2016-01-15 18:07:11

Будет ли встроенный стиль иметь приоритет над медиа-запросом?

ответ

Смежные вопросы