¿Por qué no se restablece CSS use ‘*’ para cubrir todos los elementos?

Por ejemplo, el reinicio de Meyer tiene una larga lista de elementos 1 que creo que se pueden reemplazar por un * ?

He visto algo de uso de:

 * { margin: 0; padding: 0; } 

Pero los restablecimientos más “avanzados” parecen ir con la statement explícita de las tags.

Los únicos elementos que no veo cubiertos en la lista de tags que están cubiertos (supongo) con un * son input , button y select el reinicio de Eric Meyer, de hecho, no parece tratar realmente con esos elementos en todas. Si evitar el restablecimiento de estos elementos es el problema … ¿por qué no? Los navegadores, obviamente , no todos muestran los elementos del formulario de la misma.


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
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
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
si tienes curiosidad.

Has adivinado correctamente: el motivo son los elementos del form .

Si establece border: 0 en, por ejemplo, una input , perderá el estilo nativo.

Por ejemplo: http://jsfiddle.net/nrB6N/

Y no hay manera de recuperar ese estilo predeterminado.

* es realmente, REALMENTE malo para el rendimiento (en realidad no importa en sitios pequeños, pero piensa en las repercusiones para más de 5000 elementos HTML, por ejemplo). Dirigirse a elementos específicos siempre es más rápido y más eficiente. También es algo a tener en cuenta al elegir si usar una ID o una CLASE. Cuente hoy en día con el JavaScript más que común y descubra que los elementos de orientación con ID o declaraciones de CSS precisas rinden en mejoras de rendimiento.

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

PD. Además de la velocidad, también afecta a input elementos de input , que después del borde *, el relleno y el margen 0 se vuelven bastante difíciles de diseñar para que se vean iguales en todos los navegadores, especialmente en IE. Leer más: http://www.christianmontoya.com/2007/02/01/css-techniques-i-use-all-the-time/

Principalmente porque es un golpe de rendimiento. Además, dado que no desea aplicar el restablecimiento a todos los elementos todo el tiempo, excepto los que causan problemas (alrededor del modelo de caja).

Además, restablecer el estilo de select , la input puede causar una experiencia indeseable.