Creando diseños elegantes usando              CSS Uso de selectores en los CSS
Introducción a selectoresLas reglas CSS están compuestas por una parte llamada selector y otra parte llamada declaración  ...
Selector universalSelector que referencia a todos los elementos de la página. El selector se indica mediante el asterisco ...
Selector de etiquetaAplica para todas las etiquetas de una página. Al indicar el nombre de la etiqueta, no se deben inclui...
Selector de etiquetaSe puede aplicar los   Y se pueden tener mismos estilos a       reglas comunes y varias etiquetas,    ...
Selector descendientePara referenciar elementos dentro de otros elementos. Un elemento es descendiente de otro cuando se e...
Selector descendiente<p> ... <span>texto1</span> ... <a href="">...<span>texto2</span></a> ...</p>------------------------...
Selector de claseSe usan para aplicar reglas específicas a aquellos elementos que usen una determinada clase.Se referencia...
¿Cuál es la diferencia entre?span.pag_actual { }span .pag_actual { }span, .pag_actual { }
Selector de IDPara aplicar estilos a un elemento único de la página, esto referenciando el atributo id.      #encabezado {...
Upcoming SlideShare
Loading in …5
×

Css uso selectores

442 views

Published on

Published in: Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
442
On SlideShare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
2
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Css uso selectores

  1. 1. Creando diseños elegantes usando CSS Uso de selectores en los CSS
  2. 2. Introducción a selectoresLas reglas CSS están compuestas por una parte llamada selector y otra parte llamada declaración h1 { color: #7D573E; }
  3. 3. Selector universalSelector que referencia a todos los elementos de la página. El selector se indica mediante el asterisco (*) *{ margin: 0; padding: 0; }
  4. 4. Selector de etiquetaAplica para todas las etiquetas de una página. Al indicar el nombre de la etiqueta, no se deben incluir los caracteres < y >. Por ejemplo, para la etiqueta <h1>, para la definición de la regla, únicamente se indica h1. h1 { color: #7D573E; }
  5. 5. Selector de etiquetaSe puede aplicar los Y se pueden tener mismos estilos a reglas comunes y varias etiquetas, específicas. separándolas por coma. h1, h2 { color: #7D573E; }h1, h2 { h1 { font-family: color: #7D573E; Arial; }} h2 { font-family: sans- serif; }
  6. 6. Selector descendientePara referenciar elementos dentro de otros elementos. Un elemento es descendiente de otro cuando se encuentra entre las etiquetas de apertura y de cierre del otro elemento p span { color: red; }
  7. 7. Selector descendiente<p> ... <span>texto1</span> ... <a href="">...<span>texto2</span></a> ...</p>-----------------------------------------------------------------p * span { color: red; }
  8. 8. Selector de claseSe usan para aplicar reglas específicas a aquellos elementos que usen una determinada clase.Se referencian de la siguiente forma: <span class="pag_actual">Nosotros</span> .pag_actual { color: #666666; }
  9. 9. ¿Cuál es la diferencia entre?span.pag_actual { }span .pag_actual { }span, .pag_actual { }
  10. 10. Selector de IDPara aplicar estilos a un elemento único de la página, esto referenciando el atributo id. #encabezado { background: url("fondo.jpg"); } <div id="encabezado"></div>

×