什么是cons的全局css重置* {margin:0; padding:0; }? [英] What are cons of global css reset * { margin: 0; padding: 0; }?

查看:198
本文介绍了什么是cons的全局css重置* {margin:0; padding:0; }?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

global css reset的缺点* {margin:0; padding:0; }?

What are cons of global css reset * { margin: 0; padding: 0; }?

人们更喜欢eric meyer css。

What people prefer eric meyer css.

这是eric mayer css

This is eric mayer 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: "" "";
}

不是比特和重。我从不使用很多元素,在这个休息,如blockquote和caption。

Isn't it bit specific and heavy. I never use many elements which is in this rest like blockquote and caption.

更新:
和eric重置重置9属性58个元素。

Update: and eric reset resetting 9 properties for 58 elements. isn't it also slow same like people talk about global reset.

这是什么缺点

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


推荐答案

问题是,边距和/或填充以正确显示,并且人们忘记将其设置回来。此外,对于许多元素,您将要设置自己的样式,覆盖重置,因此重置是多余的;你应该只是按照你想要的方式设置样式。

The problem is that there are some elements that need margins and/or padding to display properly, and people forget to set them back. Also, for many elements, you are going to be setting your own styles, overriding the reset, so the reset is redundant; you should instead just set the styles the way you want them.

我看到很多的一个问题是列表。如果您盲目地应用重置,列表中的项目符号会出现在包含元素之外的 之下,这总是让我困扰:

One problem I see a lot is with lists. If you blindly apply a reset, the bullets for the list will appear outside of the containing element, which always bothers me:


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

设计师有意这样做,但我认为很多时候我看到这是,因为有人盲目地应用了重置,没有想到它会做什么对列表项的缩进。如果你寻找这个,你会看到这一切的地方;并且几乎总是,你看到它的网站使用CSS重置。有关如何正确格式化列表的详细信息,请参阅Mozilla开发者中心的一致列表缩进

Perhaps some designers are deliberately doing this, but I think a lot of the time I see this, it's because someone has blindly applied a reset and not thought about what it would do to the indentation of list items. If you look for this, you will see it all over the place; and pretty much invariably, the site you see it on uses a CSS reset. For more information on how to format lists correctly, see Consistent List Indentation on the Mozilla Developer Center.

另一个问题是,在重置后,有时候人们不记得应用边距回到模糊的元素。例如,< dl> 元素;它的默认风格不是很好,但它至少让你区分< dt> < dd> 元素。如果你应用一个重置,你失去了,结束了一切挤在一起没有区别。例如,Stack Overflow的重置会使< dl> 元素几乎无用:

Another problem is that after doing a reset, there are sometimes obscure elements that people don't remember to apply margins back to. For instance, the <dl> element; it's default style isn't great, but it at least lets you distinguish between the <dt> and <dd> elements within them. If you apply a reset, you lose that and wind up with everything crammed together with no distinction. Stack Overflow's reset does this, for instance, making <dl> elements pretty much useless:



Stack Overflow的重置也没有在< dl> 元素,并且只有< p> 的底部边距;所以我不得不添加一个额外的< br> ,以防止上述< dl>


Stack Overflow's reset also lacks any top or bottom margins on the <dl> element, and only a bottom margin to <p>; so I had to add an extra <br> in order to prevent the above <dl> from running up against this paragraph.

如果您使用重置,请务必确保所有 HTML元素以合理的方式显示。并删除重置的由您添加的后续规则覆盖的部分;没有真正的理由重置< b> < i> ,然后再应用 font-weight font-style ,并且如果您将边距重置为 0 然后将其设置为 2 em ,那么为什么不删除重置为 0

If you do use a reset, be very careful to make sure that all HTML elements do display in a sensible way. And remove the parts of your reset that are overridden by later rules that you add; there's no real reason to reset <b> and <i>, and then later apply font-weight and font-style to them, and if you reset a margin to 0 and then set it to 2 em, then why not remove the reset to 0?

这篇关于什么是cons的全局css重置* {margin:0; padding:0; }?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆