En el artículo anterior de downcodes.com, mencionamos "reescribir sus archivos CSS para hacerlos más organizados y claramente estructurados". Aunque este es uno de los métodos, desarrollar buenos hábitos de codificación siempre ha sido lo que me encanta de CSS. El artículo de hoy discutirá este contenido.
El último estilo CSS definido anulará cualquier estilo existente o en conflicto definido antes, como en el siguiente ejemplo:
Código fuente de ejemplo
[www.downcodes.com] pag {color: rojo; fondo: amarillo}
pag {color: verde}
El párrafo anterior eventualmente aparecerá en fuente verde con un fondo amarillo. Esto se debe a que el último color definido: el verde sobrescribe el rojo previamente definido. En cuanto a por qué el fondo amarillo no desaparece, es por la segunda p. definición contradictoria en la definición, por lo que sigue siendo válida.
¿Realmente lo entiendes? Bien, hagamos una pequeña prueba:
Código fuente de ejemplo
[www.downcodes.com] p.rojo {color: rojo}
p.verde {color: verde}
p.azul {color: azul}
Código fuente de ejemplo
[www.downcodes.com] <p class="rojo verde azul">Texto de muestra downcodes.com</p>
<p class="verde azul rojo">Texto de muestra downcodes.com</p>
<p class="azul rojo verde">Texto de muestra downcodes.com</p>
Por favor, dígame, ¿de qué color aparecerá el texto de los tres párrafos anteriores cuando finalmente se muestre?
La respuesta es que todos se muestran en azul, es decir, azul. Aunque cada párrafo tiene tres estilos p aplicados en un orden diferente, parece que el color debe determinarse según el orden en que se aplican los estilos. , el primero se muestra en azul y el tercero en azul, el segundo en rojo y el tercero en verde. De hecho, esto no tiene nada que ver con el orden. en el que se aplican los estilos, en última instancia, todos obedecen al último estilo especificado y el color es azul.