В чем разница между Normalize.css и Reset CSS?

Question

Я знаю, что такое CSS Reset, но недавно я услышал об этой новой вещи под названием Normalize.css

В чем разница между Normalize.css и Сброс CSS ?

В чем разница между нормализацией CSS и сбросом CSS?

Это просто новое модное слово для CSS Reset?

Answer 1

Я работаю над normalize.css.

Основные различия:

1. Normalize.css сохраняет полезные значения по умолчанию, а не "стирает" все. Например, такие элементы, как sup или sub «просто работают» после включения normalize.css (и на самом деле сделаны более надежными), тогда как они визуально неотличимы от обычного текста после включения reset.css.Таким образом, normalize.css не навязывает вам визуальную отправную точку (однородность).Это может быть не всем по вкусу.Лучше всего поэкспериментировать с обоими и посмотреть, какие гели с вашими предпочтениями.

2. Normalize.css исправляет некоторые распространенные ошибки, которые выходят за рамки для reset.css. Он имеет более широкий охват, чем reset.css, а также предоставляет исправления ошибок для распространенных проблем, таких как: настройки отображения для элементов HTML5, отсутствие наследования font по элементам формы, исправление рендеринга font-size для pre, SVGпереполнение в IE9 и ошибка стиля button в iOS.

3. Normalize.css не загромождает ваши инструменты разработки. Распространенное раздражение при использовании перезагрузки.css - это большая цепочка наследования, которая отображается в инструментах отладки CSS браузера.Это не такая проблема с normalize.css из-за целевых стилей.

4. Normalize.css более модульный. Проект разбит на относительно независимые разделычто позволяет вам легко удалять разделы (например, нормализации форм), если вы знаете, что они никогда не понадобятся вашему веб-сайту.

5. Normalize.css содержит лучшую документацию. Код normalize.css документирован как inline, так и более подробно в GitHub Wiki .Это означает, что вы можете узнать, что делает каждая строка кода, почему она была включена, каковы различия между браузерами, и легче выполнять собственные тесты.Цель проекта - помочь людям узнать, как браузеры отображают элементы по умолчанию, и облегчить им участие в отправке улучшений.

Более подробно об этом я писал встатья о normalize.css

Answer 2

Основное различие заключается в том, что:

• Сброс CSS нацелен на удаление всех встроенных стилей браузера. Стандартные элементы, такие как H1-6, p, strong, em и т. Д., В конечном итоге выглядят совершенно одинаково, без какого-либо украшения. Затем вы должны добавить все украшения самостоятельно.

• Нормализация CSS направлена ​​на то, чтобы встроенный стиль браузера соответствовал для всех браузеров. Такие элементы, как H1-6, будут выделены жирным шрифтом, крупнее и так далее в разных браузерах. Затем вы должны добавить только разницу в оформлении вашего дизайна.

Если ваш дизайн a) следует общим соглашениям для типографики и так далее, и b) Normalize.css работает для вашей целевой аудитории, тогда используйте Normalize.CSS вместо сброса CSS сделает ваш собственный CSS меньше и быстрее писать.

Answer 3

Normalize.css - это, в основном, набор стилей, основанный на том, что, по его мнению, будет хорошо выглядеть, и сделает его похожим в разных браузерах. Сброс в основном удаляет стилизацию элементов, чтобы вы могли лучше контролировать стилизацию всего.

Я использую оба.

некоторые стили из Reset, некоторые из Normalize.css. Например, из Normalize.css есть стиль, гарантирующий, что все элементы ввода имеют одинаковый шрифт, чего не происходит (между вводом текста и текстовыми областями). Сброс не имеет такого стиля, поэтому входные данные имеют разные шрифты, которые обычно не нужны.

Таким образом, использование двух CSS-файлов лучше справляется с «выравниванием» всего;)

привет!

Answer 4

First reset.css - худшая библиотека, которую вы можете использовать, потому что она удаляет стандартную структуру HTML и отображает все, что вы пишете, просто в виде текста, после назначения значений отступов полей и других атрибутов для 0. Например, вы обнаружите, что <H1> будет таким же, как <H6>.

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

Answer 5

Сброс

кажется необходимостью для удовлетворения пользовательских проектных спецификаций, особенно в сложных, не шаблонных типовых проектах.Звучит так, как будто нормализация - это хороший способ начать заниматься исключительно веб-программированием, но часто веб-сайты - это брак между веб-программированием и правилами проектирования UI / UX.

Answer 6

Что ж, из его описания видно, что он пытается согласовать стиль по умолчанию с пользовательским агентом во всех браузерах, а не отбрасывать все стили по умолчанию, как при сбросе.

Сохраняет полезные значения по умолчанию, в отличие от многих сбросов CSS.

Answer 7

Иногда лучшее решение - использовать оба. Иногда это не использовать ни один. А иногда это использовать один или другой. Если вы хотите, чтобы все стили, в том числе сброс полей и отступов во всех браузерах, использовали reset.css. Тогда примените все художественные оформления и стили самостоятельно. Если вам просто нравятся встроенные стили, но вы хотите больше межбраузерной синхронизации, то есть нормализации, тогда используйте normalize.css. Но если вы решите использовать и reset.css, и normalize.css, сначала свяжите таблицу стилей reset.css, а затем (сразу) таблицу стилей normalize.css (сразу). Иногда дело не в том, какой из них лучше, а в том, когда использовать какой, а когда использовать оба, а когда нет. ИМХО.