CSS-инлайнер онлайн
Вставьте HTML и CSS, получите документ с инлайн-стилями. Удаление тегов style, локальная обработка. Пример: p{color:red}. Обработка выполняется локально в ва…
Начать работу
Возможности и ограничения
CSS-инлайнер преобразует CSS-правила в инлайн-стили. Например, для кода <style>p{color:red}</style><p>Hello</p> абзац получит инлайн-стиль color: red. Если включено удаление стилей, все теги style будут удалены, а результат будет сериализован как полный документ с doctype.
Как это работает
Браузер разбирает HTML в документ, объединяет текст всех тегов style и дополнительный CSS, находит простые селекторы с фигурными скобками и применяет соответствующие объявления к инлайн-стилю каждого элемента. Невалидные селекторы пропускаются.
Ограничения
Это лёгкая конвертация, которая не полностью реализует CSS-каскад, специфичность, медиазапросы, keyframes, псевдоэлементы, вложенный CSS, внешние таблицы стилей или вычисленные стили. Браузер может нормализовать HTML при разборе. Инструмент не загружает внешние ресурсы и работает локально.
Практические рекомендации
- Используйте для простых HTML-писем, где нужны инлайн-стили.
- Проверяйте результат в целевых клиентах.
- Не полагайтесь на инструмент как на санитайзер или гарантию неизменности отображения.
Часто задаваемые вопросы
Что произойдёт с медиазапросами?
Медиазапросы не обрабатываются; они будут проигнорированы, так как инструмент поддерживает только простые селекторы.
Можно ли использовать внешние CSS-файлы?
Нет, инструмент не загружает внешние таблицы стилей. Вы можете вставить CSS в дополнительное поле.
Почему результат отличается от ожидаемого?
Браузер может нормализовать HTML, а инструмент не реализует полный CSS-каскад. Проверьте исходный CSS и упростите селекторы.
Обработка выполняется локально в вашем браузере.