Herencia

Cuanto das formato a los elementos hay que tener en cuenta de donde se encuentran, por esto tenemos:

• los decedentes

  
                            div p { /*se aplicara los estilos a todos los elementos p que se encuentran dentro de la etiqueta div*/
                              border-style: solid;
                            }
                          

• los padres

  
                            div>img{ /*aplica formato a todas las imagenes de dentro de div sin que haya etiquetas entre div y img */
                              border-style: solid;
                            } 
                          

• los hermanos

  
                            p+p { /*formatea el elemento p que se encuentra después de otro elemento p*/
                              color:white;
                            }
                          

Con Css se pueden agrupar elementos de esta forma:

• agrupar y combinar elementos

                      td, li {
                        color:blue;
                      }

                      div .li { /*se aplican reglas de precedencia*/
                        color:blue;
                      }
                    

• restringir el alcance de un selector

                      p*a {/*muestra los enlaces a que están dentro de algún otro elemento, que a su vez desciende de p, de color rojo */
                        color:red;
                      }
                    

• crear clases

                      .especial{ /*aplica el color azul a todos los elementos que tienen class=”especial”*/
                        color:blue;
                      }
                    

• aplicar un estilo a un solo elemento en toda la pagina web, es decir un id

                      #diferente { /*aplica el estilo al elemento que tienen id=”diferente”*/
                        color:black;
                      }
                    

Siguiente

Anterior