2015-08-11 4 views
6

Почему я не могу просто сделать простой сброс:CSS Reset против * джокера

* { margin: 0; padding: 0; font-size: 100% }

вместо:

html, body, div, span, object, iframe, 
h1, h2, h3, h4, h5, h6, p, blockquote, pre, 
abbr, address, cite, code, 
del, dfn, em, img, ins, kbd, q, samp, 
small, strong, sub, sup, var, 
b, i, 
dl, dt, dd, ol, ul, li, 
fieldset, form, label, legend, 
table, caption, tbody, tfoot, thead, tr, th, td, 
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary, 
time, mark, audio, video { 
    margin:0; 
    padding:0; 
    border:0; 
    outline:0; 
    font-size:100%; 
    vertical-align:baseline; 
    background:transparent; 
} 
+1

По [MDN] (https://developer.mozilla.org/en-US/docs/Web/CSS/Common_CSS_Questions#Use_of_the_.2A_selector) «Использование селектора * должно быть сведено к минимуму, поскольку это медленный селектор , особенно когда он не используется в качестве первого элемента селектора. Его использование следует избегать как можно больше ». – j08691

ответ

5

Прежде всего вы можете.

Отвечая на вопрос: потому что вы, вероятно, не хотите иметь все элементы с указанными параметрами. Например, у вас нет входных данных, кнопок и т. Д.

+0

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

+1

@RobertRocha «*» выбирает весь элемент, который занимает больше времени, и вы, как правило, не хотите иметь кучу правил несоблюдения правил. Хорошо использовать только самые распространенные, минус те, на которые вы не хотите иметь правило. –

2

Возможно, потому что селектор типов имеет больше specificity, чем универсальный селектор.

Или потому, что этот сброс CSS не хочет соответствовать всем элементам, например input s.

2

Применение всех этих стилей ко всем элементам приведет к непредвиденному стилю. Пожалуйста, проверьте следующее текстовое поле, выпадающий список, и сброс всех текстовой ваши стили сброса:

<input type="text" value="foo" /> 
<select> 
<option>Foo</option> 
<option>Bar</option> 
</select> 
<textarea rows="10" columns="30">foo</textarea> 

http://jsfiddle.net/esm63r30/

Довольно голый!

+0

Ну, я не включил границу. –

+0

@RobertRocha Действительно, но дело в том, что если вы применяете эти стили так широко, вы можете оказаться в непреднамеренных стилях. Сброс, который вы включили, касается определенных элементов по какой-либо причине. –

1

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

Использование подстановочный Сбросить

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

Удаляя все форматирование по умолчанию из всех тегов HTML, вы вынуждаете себя создавать пользовательские стили для этих тегов. Помните, вы можете думать только о div, span, ul, li и других общих элементах, полностью забывая об abbr, pre и cite.

1

Это обычный метод, называемый сбросом CSS. В разных браузерах используются разные значения по умолчанию, что приводит к тому, что сайты выглядят по-разному. * Означает «все элементы» (универсальный селектор), поэтому мы устанавливаем для всех элементов нулевые поля и нулевое заполнение, что делает их одинаковыми во всех браузерах.