css html5 css-reset

Reinicio de CSS para HTML5



css-reset (5)

HTML5 todavía no es ampliamente compatible. Como tal, no creo que encuentre una hoja de estilo de reinicio específica de HTML5 todavía. Mi recomendación sería tomar Eric Meyer y agregar las etiquetas para HTML5. (por ejemplo, navegación, encabezado, pie de página, etc.)

¿Mejores prácticas?

¿En qué se diferencia esto de HTML4 o XHTML1?

Hay mucha discusión aquí: http://html5doctor.com/html-5-reset-stylesheet/

Me pregunto qué otros recursos / discusión existe.


Hay mucho por hacer. No puedes tomar a una persona css como evangelio. Hace poco realicé una hoja de reinicio personalizada revisando partes de boilerplate, YUI, mis preferencias y algunos otros métodos de ppls. Es más a la preferencia y la practicidad. En cuanto a la diferenciación de los estándares html5 css de xhtml y html4, no se moleste en comparar, debe tratar de utilizar los tipos de documentos html5 para todo su nuevo trabajo, a menos que su proyecto requiera específicamente de xhtml por solicitud.


Los comentarios en ese post son de locos. Ciertamente no vas a encontrar una discusión más completa. Creo que deberías eliminar las reglas innecesarias y las etiquetas desaprobadas de cualquier reinicio que hayas estado usando y mantenerte en camion. Paul Irish (colaborador principal de jQuery, co-creador de Modernizr y ahora Googler) tiene un comentario en el artículo al que se vincula que tiene toda la nivelación de CSS específica de HTML5 que probablemente necesite:

article, aside, dialog, figure, footer, header, hgroup, nav, section { display:block; zoom:1; }

Google está utilizando una versión más simple en su base.css en HTML5Rocks.com:

section, article, header, footer { display: block; }

Aún necesitarás usar el simple Shiv HTML5 o Modernizr de Remy Sharp para ejecutar un bucle de JavaScript para habilitar el estilo de los nuevos elementos HTML5 en IE. HTML5 Shiv simplemente crea los elementos para permitir el estilo, Modernizr es una solución mucho más completa de detección / estilo de HTML5 y CSS3. Hay otra excelente publicación en HTML5 Doctor que vale la pena ver, Cómo usar HTML5 en su trabajo cliente ahora mismo desde marzo de 2010, co-escrito por Remy y Richard 8 meses después del artículo de reinicio. Mencionan el uso de Modernizr "para detectar Web Forms 2.0 y otra compatibilidad de tipo HTML5".

Además, Dion (de Ajaxian y ahora Palm) tuiteó sobre css3pie que representará elementos visuales como radio de borde, sombra de cuadro y gradientes en IE. No puedo responder por mí mismo.

(Tenía más enlaces aquí pero tuve que eliminar todos menos un b / c, mi representante es <10, si hay algo que no puedes encontrar. Responde y lo publicaré).


Modifiqué el reinicio de Eric Meyers a fines del año pasado para HTML5. Úselo para cada proyecto, y funciona muy bien: CSS Reset Refreshed

Establece los nuevos elementos de bloque HTML5 para mostrar en consecuencia. Esto no se hace en ningún navegador convencional hoy en día, y tendrá problemas si no lo configura.

También "restablece" los estilos de elementos HTML5. Técnicamente, el restablecimiento aún no es necesario, ya que los navegadores no diseñan elementos HTML5 de forma nativa, pero su sitio estará preparado para el futuro cuando lo hagan.


Solo uso mi variación del reinicio de Eric Meyer, con mis propias preferencias. Para compatibilidad con HTML5, agrego los nuevos elementos según sea necesario.

Una cosa en particular es que los nuevos elementos están sin estilo por defecto, por lo que debe proporcionar sus propios valores predeterminados. Esto es especialmente importante para los elementos de bloque como la sección, el lado y el artículo. Debe asegurarse de especificar display:block para esos elementos.