No tienes acceso a esta clase

¬°Contin√ļa aprendiendo! √önete y comienza a potenciar tu carrera

Componentes en Astro

10/25
Recursos

Aportes 2

Preguntas 0

Ordenar por:

¬ŅQuieres ver m√°s aportes, preguntas y respuestas de la comunidad?

o inicia sesión.

ūüďĚEl sistema de maquetado de Astro es muy parecido a Vue o Svelte, y con el tema de los estilos tambi√©n.
Por ejemplo, los estilos que viven dentro de un componente son por defecto locales, es decir, no afectan a otros componentes de tu sitio. Si bien siempre es recomendable usar estilos locales para la mayoría de los casos, eventualmente puedes encontrar una razón válida para escribir CSS global. Puedes desactivar el CSS con alcance local predeterminado con el atributo <style is:global>.

<style is:global>
  /* Global, entregada tal como est√° al navegador.
     Se aplica a todas las etiquetas <h1> de tu sitio web. */
  h1 { color: red; }
</style>

También puedes mezclar reglas de CSS globales y locales en la misma etiqueta <style> usando el selector :global(). Esto se convierte en un patrón poderoso para aplicar estilos CSS a los elementos hijos de tu componente.

<style>
  /* Con alcance solo a este componente */
  h1 { color: red; }
  /* Mixta: se aplica solo a los elementos `h1` hijos. */
  article :global(h1) {
    color: blue;
  }
</style>
<h1>Title</h1>
<article><slot /></article>

ūüĎÄRECUERDA ‚ö†ÔłŹ:

Los estilos locales deben usarse con la mayor frecuencia posible. Los estilos globales deben usarse solo cuando sea necesario.

cuando subieron este curso jeje llegue aqui por google jeje