Why don't CSS resets use '*' to cover all elements?

左心房为你撑大大i 提交于 2019-11-26 12:47:18

问题


For example, the Meyer reset has a long list of elements1 which I believe can be replaced with a *?

I have seen some use of:

* {
   margin: 0;
   padding: 0;
 }

But more \"advanced\" resets seem to go with explicitly stating the tags.

The only elements I don\'t see covered in the tag list that are covered (I presume) with a * are input, button, and select—the Eric Meyer reset, in fact, doesn\'t appear to really deal with those elements at all. If avoiding resetting these elements is the issue…why wouldn\'t you? Browsers obviously don\'t all display form elements the same.


1 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, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, I, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary, time, mark, audio, video
if you\'re curious.


回答1:


You've guessed correctly - the reason is form elements.

If you set border: 0 on for example an input, it will lose the native styling.

For example: http://jsfiddle.net/nrB6N/

And, there's no way to get that default styling back.




回答2:


* is really, REALLY bad for performance (doesn't really matter on small sites, but think the repercussions for 5000+ HTML elements for example). Targetting specific elements is always faster and more efficient. It's a thing to also keep in mind when choosing wether to use an ID or an CLASS. Count in the more than common JavaScript today, and you find out that targetting elements with ID's or precise CSS statements yields in performance improvements.

http://code.google.com/speed/page-speed/docs/rendering.html#UseEfficientCSSSelectors

ps. Apart from speed, it also affects input elements, which after the * border, padding, and margin 0 become quite difficult to style so that they look the same accross browsers, especially in IE. Read more: http://www.christianmontoya.com/2007/02/01/css-techniques-i-use-all-the-time/




回答3:


Mainly because its a performance hit. Also, since you do not want to apply reset to all elements all the time but the ones known to cause issues (around box model).

Also, resetting style of select, input may cause undesirable experience.



来源:https://stackoverflow.com/questions/6880002/why-dont-css-resets-use-to-cover-all-elements

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!