WINTXCODERS Terminal
[visitante@wintxcoders-pc ~]:$ Bienvenido a la comunidad
Recuerda que puedes participar en nuestra comunidad registrándote

Pseudo-clases CSS3

Iniciado por @Zanut Sec, Febrero 13, 2015, 03:06:12 PM

« anterior - próximo »

@Zanut Sec

Visitante
  • Febrero 13, 2015, 03:06:12 PM Last Edit: Febrero 13, 2015, 03:53:16 PM by Granainos
    Hola muy buenas amigos, hoy estaba mirando cosas de CSS3 por internet y pensé en vosotros busque un curso para a ver que me podía pensar para publicároslos y vi una cosa llama "Pseudo-clases" no tenia ni idea que era y empecé a mirar y voy a aportároslos.

    -. Por las pseudos-clases el control del nuestro code HTML5 seria mucho mas entendible y sencillo. Ahora aca, aportare los significados de cada clase (cogidos de aquella web, para ahorrar tiempo y que ustedes entendáis mejor)

    •:only-child. Selecciona el elemento si es el único elemento hijo.
      •:only-of-type. Selecciona el elemento si es el único elemento hijo de ese tipo.   
    •:root. Selecciona el elemento raíz del documento.
      •:empty. Selecciona los elementos que no tienen hijos.
      •:enabled. Selecciona los elementos de la interfaz que tengan un estado de enable.
      •:disabled. Selecciona los elementos de la interfaz que tengan un estado disabled.
      •:checked. Selecciona los checkboxes o radio buttons que estén activados.
      •:not(S). Selecciona los elementos que no coincidan con el selector especificado.
      •:nth-last-child(N). Selecciona los elementos tomando de referencia el último elemento de una lista. N es el número de posición desde el último elemento, donde el valor 1 equivaldría al último.
      •:nth-child(N). Selecciona los elementos en base a sus posiciones en una lista de elementos hijos dentro de un elemento padre. N es el número de la posición.


    Bueno amigos aquí dejare ahora algunos ejemplos:
    Spoiler

    /*Selecciona los elementos impares de la clase .nthchild*/
    .nthchild:nth-child(odd){
       color:red;
    }


    /*Selecciona el penúltimo elemento de la clase .nthlastchild*/
    .nthlastchild:nth-last-child(2){
       color:blue;
    }


    /*Selecciona los párrafos pares dentro de una capa*/       
    div>p:nth-of-type(even){
       color:red;
    }
    [close]
    También quiero deciros que lo siento pero copiar y pegar algunas cosas pero yo no sabia esas clases ni esas cosas entonces aparte de que yo aprendo lo aporto para que ustedes aprendáis.
    Saludos, @Zanut Sec  :D.