Каковы минусы глобального сброса css * {margin: 0; отступы: 0; }? - PullRequest
4 голосов
/ 19 января 2010

Каковы минусы глобального сброса css * {margin: 0; отступы: 0; }?

Что люди предпочитают Эрик Мейер css.

Это Эрик Майер, css

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-weight: inherit;
    font-style: inherit;
    font-size: 100%;
    font-family: inherit;
    vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
    outline: 0;
}
body {
    line-height: 1;
    color: black;
    background: white;
}
ol, ul {
    list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
    border-collapse: separate;
    border-spacing: 0;
}
caption, th, td {
    text-align: left;
    font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content: "";
}
blockquote, q {
    quotes: "" "";
}

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

Обновление: и eric reset сброс 9 свойств для 58 элементов. Разве это не так же медленно, как люди говорят о глобальном сбросе.

Какие минусы использовать это

* { margin: 0; padding: 0; }
select { min-width:1.5em; }

Ответы [ 9 ]

10 голосов
/ 19 января 2010

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

Одна проблема, которую я вижу, связана со списками. Если вы слепо примените сброс, маркеры для списка появятся за пределами содержащего элемента, что меня всегда беспокоит:

    +--------------------+
    | Some paragraph,    |
    | with text.         |
    |                    |
   *| One                |
   *| Two                |
   *| Three              |
    +--------------------+

Возможно, некоторые дизайнеры намеренно делают это, но я думаю, что большую часть времени я вижу это, потому что кто-то слепо применил сброс и не думал о том, что это сделает с отступом элементов списка. Если вы посмотрите на это, вы увидите это повсюду; и почти всегда, сайт, на котором вы видите его, использует сброс CSS. Для получения дополнительной информации о правильном форматировании списков см. Согласованный отступ списка в Mozilla Developer Center .

Другая проблема заключается в том, что после сброса иногда возникают неясные элементы, к которым люди не помнят, чтобы применить поля обратно. Например, элемент <dl>; его стиль по умолчанию не очень хорош, но, по крайней мере, позволяет различать элементы <dt> и <dd> внутри них. Если вы применяете перезагрузку, вы теряете это и в итоге получаете все, что забито без различий. Сброс переполнения стека делает это, например, делая элементы <dl> практически бесполезными:

Срок
Определение
Срок
Определение


В сбросе переполнения стека также отсутствуют верхние или нижние поля элемента <dl> и только нижнее поле до <p>; поэтому мне пришлось добавить дополнительный <br>, чтобы не допустить столкновения вышеупомянутого <dl> с этим параграфом.

Если вы используете сброс, будьте очень внимательны, чтобы все HTML-элементы отображались разумным образом. И удалите части вашего сброса, которые переопределяются более поздними правилами, которые вы добавляете; Нет никакой реальной причины сбрасывать <b> и <i>, а затем применять к ним font-weight и font-style, и если вы сбросите поле на 0, а затем установите его на 2 em, то почему бы и нет удалить сброс до 0?

3 голосов
/ 19 января 2010

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

Что касается скорости, если скорость каскадирования <100 стилей на вашем сайте - это то, что делает или ухудшает вашу производительность, у вас, вероятно, есть более серьезные проблемы под рукой. Убедитесь, что кешировано максимально возможное количество файлов, и не прибегайте к дополнительным правилам CSS. </p>

2 голосов
/ 20 января 2010

Разница незначительна, но на самом деле «правило звезды» обрабатывается по мере прохождения каждого элемента, применяя (или удаляя в этом случае) стили по умолчанию.

Сбрасывается, как целевые элементы Эрика Мейера, что означает немного меньшее время обработки.

2 голосов
/ 19 января 2010

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

Минусы: Я создал свой собственный способ сброса назад и сделал ошибки, которые мне пришлось вернуться и удалить. Следовательно, если вы используете сброс другого пользователя и он содержит что-то, чего вы не ожидали, вы можете «потерять функциональность» на некоторых объектах, к которым вы привыкли. Это можно исправить, стерев сбойный сброс, если вам нужно.

Плюсы: Я работаю с перезагрузками уже почти год, и мне это очень нравится. Я действительно не замечаю каких-либо проблем с производительностью, и ничто не удивляет меня в том, как отображаются элементы, и мне не нужно делать глупости, такие как установка поля / отступа тела и html равным 0 при создании нового сайта. 1005 *

2 голосов
/ 19 января 2010
Скорость

- это недостаток, однако небольшое влияние, при использовании глобальной таблицы стилей (*) атрибуты применяются к КАЖДОМУ элементу, даже если вы не используете один или несколько

1 голос
/ 05 августа 2011

Установка высоты строки на 1, как предлагается, просто неверна с точки зрения разборчивости. Даже в контексте печати программное обеспечение макета устанавливает высоту строки по умолчанию (ведущую) около 1,15. В Интернете, где у вас часто бывают длинные меры (длины строк), вы ДОЛЖНЫ иметь высоту строки больше 1 (обычно я начинаю с 1,5, а часто и до 1,75). Есть причина для типографских принципов, и это должно помочь удобочитаемости. Установка сплошного, условия печати для высоты строки, равной 1, должна использоваться только в особых ситуациях, таких как заголовки очень большого размера. ЭТО НЕ ДОЛЖНО БЫТЬ ПО УМОЛЧАНИЮ.

Да, люди «могут» пересматривать / изменять сброс в своих собственных стилях, но факт заключается в том, что этот сброс воспринимается как святой Грааль многими, кто слепо принимает его и никогда не меняет вещи, используя здравые типографские принципы. И этот сайт является иллюстрацией проблемы. Вашему глазу нужно некоторое вертикальное пространство, чтобы легко следовать от конца одной линии к началу другой. Когда высота строки равна размеру шрифта, это затрудняет чтение текста.

1 голос
/ 19 января 2010

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

Проблема иногда заключается в том, что на различные элементы, такие как p, h1, h2 и т. Д., Влияют высота строки, размер шрифта и т. Д., Поэтому простое заполнение: 0 и margin: 0 не гарантирует полного сброс.

Надеюсь, это поможет.

0 голосов
/ 21 января 2010

Не использовать сброс.

Сбросы действительно раздражают коллег и будущих разработчиков.

Когда я добавляю тег h1, я ожидаю наличие поля и отступов. Когда я добавляю тег p, я ожидаю пробел между каждым абзацем.

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

0 голосов
/ 19 января 2010

для браузера есть некоторые поля по умолчанию и отступы, и они могут быть другими для каждого элемента (например, другой для li и для ввода) в зависимости от браузера. Сброс этого значения гарантирует, что в каждом браузере для всех элементов поля и отступы равны 0

...