Restablecer CSS: páginas web con un estilo realmente cross-browser

En este breve artículo vamos a ver lo que CSS es la técnica de restablecer CSS y la mejor manera de utilizar para crear realmente cross-browser páginas web.

CSS Reset: lo que son y lo que están

Crear las páginas del navegador web totalmente transversal es un problema que, desde hace varios años (es decir, cuando Internet Explorer ya no es una cuota de mercado del 95%) afecta a todos los diseñadores web. Pero incluso cuando el resultado es compatible con todos los navegadores (no tiene, es decir, mal funcionamiento o defectos de pantalla con capacidad de afectar a la capacidad de uso del servicio), la salida de la página web casi siempre en función de si diferentes vistas con IExplorer , Firefox, Safari, Chrome u Opera.

Estoy hablando de pequeñas diferencias, a veces casi imperceptible, pero sin embargo, implican un alejamiento de las expectativas del resultado final de los diseñadores de páginas web (por ejemplo, porque el espacio entre dos elementos es ligeramente mayor que un navegador a otro).

Este problema se debe a la configuración por defecto del software de navegación que implican diferencias individuales, más o menos notable, cuando se hacen la misma página web.
Para resolver este problema se recurre a una técnica que se llama Restaurar CSS, que consiste, esencialmente, un conjunto de instrucciones en el uso de CSS con el fin de "restablecer" los valores por defecto en los navegadores individual.

CSS Reset: una solución simple

Una solución, no refinados, es declarar el inicio de una regla de la hoja de estilo que se cancela, para cada elemento de la página, por lo general una serie de atributos definidos por los navegadores (como, por ejemplo, el margen, el relleno)

 



 * {



  



 margin: 0;



  



 padding: 0;







 }

 

o:

 



 * {



  



 margin: 0;



  



 padding: 0;



  



 frontera: 0 ninguno;



  



 esquema: 0;







 }

 

o, más elaborada:

 



 * {

 

  



 vertical-align: línea de base;



  



 font-weight: heredar;



  



 font-family: inherit;



  



 font-style: heredar;



  



 font-size: 100%;



  



 margin: 0;



  



 padding: 0;



  



 frontera: 0 ninguno;



  



 esquema: 0;







 }

 

De hecho, no puedo recomendar el uso de estas soluciones fáciles como el uso del selector universal (asterisco) puede llevar a resultados no siempre son óptimas.

• <<
• 1
• 2
• >>