Normalize.css
párese que no pero si es importante o una opción fiable incluir este pequeño archivo en nuestra carpeta .
Una alternativa moderna, HTML5 listo para CSS reinicia
Normalize.css hace navegadores muestran los elementos más consistente y de acuerdo con los estándares modernos. Se dirige precisamente sólo los estilos que necesitan normalización.
http://necolas.github.io/normalize.css/
Valor por defecto para definir todo a un mismo tamaño .
listas H1,H2,H3 etc.
por medio de un archivo css .
el archivo lo descargas en este enlace
http://necolas.github.io/normalize.css/
Valor por defecto para definir todo a un mismo tamaño .
listas H1,H2,H3 etc.
por medio de un archivo css .
el archivo lo descargas en este enlace
http://necolas.github.io/normalize.css .
.
Después
Solo hay que colocarlo junto con la carpeta que estamos trabajando
y conectarlos a través de una rutas relativa o directamente desde el html .
Como conectarlo .
<link rel="stylesheet" href="normalize.css">
y
Como trabajar con rutas relativas .
por ejemplo si tengo mi proyecto formado por carpetas y una de ellas es css (donde coloco todo los css )
la ruta relativa es la siguiente .
<link rel="stylesheet" href="css/normalize.css">
y el archivo es este .
Solo tienes que descargarlos desde la web del autor lo coloco por si quieres chequearlo .
Solo tienes que descargarlos desde la web del autor lo coloco por si quieres chequearlo .
Un +1 apoyaría la entrada si te fue de utilidad gracias . ;)
-----------------------------------------------------------------------------------------------------------
/ *! normalize.css v2.1.1 | MIT License | git.io / normalizar * / / * ================================================ ========================== HTML5 definiciones pantalla ================================================== ======================== * / / ** * Corregir `` bloquear pantalla no se define en el IE 8/9. * / artículo, a un lado, detalles, figcaption, figura, pie de página, cabecera, hgroup, principal, nav, sección, Resumen { display: block; } / ** * Corregir `inline-block` No mostrar definido en IE 8/9. * / de audio, lona, vídeo { display: inline-block; } / ** * Evitar los navegadores modernos muestre `audio sin controles. * Eliminar el exceso de altura en los dispositivos iOS 5. * / audio: no (controles []) { display: none; Altura: 0; } / ** * Dirección de estilo no está presente en IE 8/9. * / [Oculto] { display: none; } / * ================================================ ========================== Base ================================================== ======================== * / / ** * 1. Color de fondo Prevenir la combinación de colores del sistema que se utiliza en Firefox, IE, * Y Opera. * 2. Color del texto prevenir la combinación de colores del sistema que se utiliza en Firefox, IE, y * Opera. * 3. Establezca familia de fuentes predeterminada de sans-serif. * 4. Evite que el tamaño del texto iOS ajustar después del cambio de orientación, sin desactivar * Ampliación de usuario. * / HTML { background: # fff; / * 1 * / color: # 000; / * 2 * / font-family: sans-serif; / * 3 * / -Ms-text-size-adjust: 100%; / * 4 * / -Webkit-text-size-adjust: 100%; / * 4 * / } / ** * Eliminar margen predeterminado. * / body { margin: 0; } / * ================================================ ========================== Enlaces ================================================== ======================== * / / ** * Dirección `inconsistencia contorno entre Chrome y otros navegadores. * / a: focus { esquema: delgado puntos; } / ** * Mejorar la legibilidad cuando se centra y del ratón se cernía en todos los navegadores. * / un activo, a: hover { Esquema: 0; } / * ================================================ ========================== Tipografía ================================================== ======================== * / / ** * La variable Dirección `H1 'font-size y el margen dentro de la sección` `y` artículo ` * Contextos en Firefox 4 +, Safari 5 y Chrome. * / h1 { font-size: 2em; margen: 0.67em 0; } / ** * Dirección de estilo no está presente en IE 8/9, Safari 5 y Chrome. * / abbr [título] { border-bottom: 1px dotted; } / ** * Dirección de estilo de juego a `` audaces en Firefox 4 +, Safari 5 y Chrome. * / b, strong { font-weight: bold; } / ** * Dirección de estilo no está presente en Safari 5 y Chrome. * / dfn { font-style: cursiva; } / ** * Diferencias de direcciones entre Firefox y otros navegadores. * / hr { -Moz-box-sizing: Contenido de la caja; caja de tamaño: el contenido de la caja; Altura: 0; } / ** * Dirección de estilo no está presente en IE 8/9. * / mark { background: # ff0; color: # 000; } / ** * Familia de la fuente correcta establece curiosamente en Safari 5 y Chrome. * / código, kbd, pre, samp { font-family: monospace, serif; font-size: 1em; } / ** * Mejorar la legibilidad del texto con formato previo en todos los navegadores. * / pre { white-space: pre-wrap; } / ** * Establecer los tipos de cotizaciones consistentes. * / q { citas: "\ 201C" "\ 201D" "\ 2018" "\ 2019"; } / ** * Dirección inconsistente y variable de tamaño de la letra en todos los navegadores. * / pequeña { font-size: 80%; } / ** * Prevenir `sub` y `apoyo 'afecta' line-height 'en todos los navegadores. * / sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: línea de base; } sup { top:-0.5em; } sub { inferior:-0.25em; } / * ================================================ ========================== Contenido incrustado ================================================== ======================== * / / ** * Eliminar la frontera cuando dentro de `a` elemento en IE 8/9. * / img { frontera: 0; } / ** * Desbordamiento correcta aparece extrañamente en IE 9. * / svg: no (: root) { overflow: hidden; } / * ================================================ ========================== Figuras ================================================== ======================== * / / ** El margen no está presente en Internet Explorer 8.9 y Safari 5 Dirección. * / la figura { margin: 0; } / * ================================================ ========================== Formas ================================================== ======================== * / / ** * Definir las fronteras consistente, el margen y el relleno. * / fieldset { border: 1px solid # c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; } / ** * 1. `El color correcto 'no se hereda en IE 8/9. * 2. Remueva la curia para que la gente no caiga en ellas si fuera cero fieldsets. * / leyenda { frontera: 0, / * 1 * / padding: 0; / * 2 * / } / ** * 1. Familia de la fuente correcta no se hereda en todos los navegadores. * 2. Correcta tamaño de la letra no se hereda en todos los navegadores. * 3. Márgenes Establecer dirección diferente en Firefox 4 +, Safari 5 y Chrome. * / botón, de entrada, seleccionar, textarea { font-family: inherit; / * 1 * / font-size: 100%; / * 2 * / margin: 0; / * 3 * / } / ** * Dirección de Firefox 4 + ajuste `line-height` on `input` con `! 'Importante en * La hoja de estilo UA. * / botón, input { line-height: normal; } / ** * Dirección inconsistente 'herencia' text-transform para el botón `` y `seleccione`. * Todos los demás elementos de control de formulario no heredan text-transform `valores`. * Corregir `botón` herencia de estilos en Chrome, Safari 5 +, y el IE 8 +. * Corregir `seleccione` herencia de estilos en Firefox 4 + y Opera. * / botón, seleccione { text-transform: none; } / ** * 1. Evite el error en WebKit Android 4.0. * Donde (2) destruye nativa `audio` Controles * y 'vídeo'. * 2. Incapacidad correcta al hacer clic en los tipos de entrada `estilo` en iOS. * 3. Mejorar la usabilidad y consistencia de estilo del cursor entre los de tipo imagen * `` De entrada y otros. * / botón, entrada HTML [type = "button"], / * 1 * / input [type = "reset"], input [type = "submit"] { -Webkit-apariencia: Botón / * 2 * / cursor: pointer; / * 3 * / } / ** * Re-set cursor predeterminado para los elementos de movilidad reducida. * / botón [desactivado], entrada HTML [desactivado] { cursor: default; } / ** * 1. Cuadro Dirección dimensionamiento en `content-box 'en IE 8/9. * 2. Retire el exceso de relleno en IE 8/9. * / input [type = "checkbox"], input [type = "radio"] { caja de tamaño: frontera-box; / * 1 * / padding: 0; / * 2 * / } / ** * 1. `Apariencia Dirección` en `searchfield` en Safari 5 y Chrome. * 2. Dirección `caja de tamaño` en `frontera-box 'en Safari 5 y Chrome * (Incluya `-moz` a prueba de futuro). * / input [type = "search"] { -Webkit-aspecto: campo de texto; / * 1 * / -Moz-box-sizing: Contenido de la caja; -Webkit-box-sizing: Contenido de la caja; / * 2 * / caja de tamaño: el contenido de la caja; } / ** * Eliminar acolchado interior y el botón de búsqueda cancelar en Safari 5 y Chrome * En OS X. * / input [type = "search"] ::-webkit-search-cancel-botón, input [type = "search"] ::-webkit-search-decoration { -Webkit-aspecto: ninguno; } / ** * Eliminar el relleno interior y fronterizo en Firefox 4 +. * / Botón ::-moz-focus-interior, Entrada ::-moz-focus-interior { frontera: 0; padding: 0; } / ** * 1. Retire default barra de desplazamiento vertical en IE 8/9. * 2. Mejorar la legibilidad y la alineación en todos los navegadores. * / textarea { overflow: auto; / * 1 * / vertical-align: top; / * 2 * / } / * ================================================ ========================== Tablas ================================================== ======================== * / / ** * Eliminar la mayor separación entre celdas de la tabla. * / table { border-collapse: collapse; border-spacing: 0; }
Comentarios
Publicar un comentario