Пожалуйста, объясните мне сброс Эрика Мейера CSS - PullRequest
Новая
       52

Пожалуйста, объясните мне сброс Эрика Мейера CSS

1 голос
/ 24 октября 2011

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

Я не хочу выполнять тяжелую работу по тестированию с идеальным пикселем в каждом браузере каждый раз, когда я что-то меняю и не надеваюЯ не хочу полностью переписывать все CSSотступы и <input>, <select>, etc. потеряют отступы и границы.Поэтому я должен указать их вручную.

Этот код сложнее понять: 

*{
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

И я совершенно запутался с этим: 

body {
    line-height: 1;
}

Ответы [ 2 ]

9 голосов
/ 24 октября 2011 
*{
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

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

vertical-align: baseline; - это еще одно широко распространенное правило, позволяющее избежать правил агента пользователя, которые не всегда применяют это (я полагаю) ожидаемое поведение по умолчанию ко всем элементам.

Вот краткий обзор того, что это делает: демо . В демоверсии попробуйте установить правило middle вместо text-top. 

body {
    line-height: 1;
}

Это то же самое. Если вы не знакомы с высотой строки, это довольно просто. Возможно, вы имели дело с этим, не осознавая этого: иногда это кажется проблемой с маржой, когда на самом деле высота строки элемента превышает ожидаемую. Это часто происходит, когда вы помещаете гарнитуру в дизайн, который имеет очень отличную высоту x от других гарнитур.

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

Кажется, вы не совсем понимаете атрибуты css и то, как они влияют на элементы. Чем лучше вы это понимаете, тем лучше вы можете использовать сброс. Нет сброса действительно подходит всем по нескольким причинам. Например, вы не можете использовать какие-либо элементы, где vertical-align может в конечном итоге не соответствовать. Вы можете иметь правила в большом сбросе, которые применяются к элементам, которых у вас даже нет.

Как и в случае с веб-дизайном, если вы этого не понимаете, то практический опыт многому вас научит.

3 голосов
/ 24 октября 2011

Проверьте эту скрипку с простым управлением ввода в форме:

http://jsfiddle.net/KXYHw/

Переключите сброс и посмотрите, как изменяется входной шрифт и размер шрифта.

...