Sobre pseudo-clases y pseudo-elementos

2/Jul/2015 95

Las pseudo-clases y los pseudo-elementos son tipos de selectores CSS que permiten alcanzar estados y elementos que no están en el DOM original. La lista de pseudo-clases es amplia, la de pseudo-elementos no ha crecido hasta la actual versión de CSS3 (aunque en CSS4 se vienen varios más):

Pseudo-clases:

  • :link
  • :visited
  • :active
  • :hover
  • :focus
  • :target
  • :empty
  • :enabled
  • :disabled
  • :checked
  • :nth-child(n)
  • :nth-last-child(n)
  • :nth-of-type(n)
  • :nth-last-of-type(n)
  • :first-child
  • :first-of-type
  • :last-of-type
  • :only-child
  • :only-of-type
  • :root
  • :lang(x)
  • :not(s)

Pseudo-elementos:

  • ::before
  • ::after
  • ::first-line
  • ::first-letter

Mientras las pseudo-clases se encargan de entregar una manera de seleccionar elementos HTML basados en la información que no es accesible en el DOM (por ejemplo, el estado :active ó su posición basado en los elementos hermanos como :nth-of-type()), los pseudo-elementos crean una abstracción en el DOM creando un nuevo elemento virtual el que puede ser manipulado en su contenido y forma (por ejemplo ::before).

Nomenclatura:

El estándar CSS2.1 define a ambos con doble-punto (:) pero en CSS3 las pseudo-clases se prefijan con doble-punto (:) y los pseudo-elementos con doble-doble-punto (::). Lamentablemente nos queda IE8 en el regazo, soportando estas útiles e importantes pseudo-propiedades sólo con doble-punto (:); como consecuencia todos los browsers siguen soportando ambas nomenclaturas. Si sigues soportando IE8, debes usar doble-punto (:); caso contrario puedes utilizar doble-doble-punto (::) para pseudo-elementos si quieres obedecer las reglas CSS3 de W3C.

Links:

Comentarios

  1. Afdtvo [#]

    cymbalta 30 mg capsule – cymbalta australia duloxetine 400 mg

  2. Bulanf [#]

    duloxetine from canada – cymbalta 90 mg capsule duloxetine prozac

  3. zithromax without prescription [#]

    azithromycin generic name https://zithromaxes.com/ zithromax pills

  4. zithromax 1000mg [#]

    nikkomycin z https://zithromaxes.com/ zithropan

  5. tadalafil tablets [#]

    maximpeptide reviews https://tadalisxs.com/ tadalafil 5mg tablets

  6. Zqwrds [#]

    synthroid brand name in india – synthroid 345245 levothyroxine 75 mcg lowest price

  7. vitriol [#]

    erectile 20170 elderly https://plaquenilx.com/ is erectile dysfunction common in older men

  8. Istntr [#]

    synthroid brand prices – generic synthroid where can i buy levothyroxine cheap

  9. hydroxychloroquine sulfate oval pill [#]

    plaquenil 400 mg https://hydroxychloroquinex.com/# – serment d’hippocrate hydroxychoroquine

  10. best online casinos [#]

    casino online https://playcasinovivo.com/# big fish casino play casino

  11. tadalafil online [#]

    tadalafil troches https://tadalisxs.com/ – tadalafil dosage tadalafil 30mg tadalafil online

  12. Ryawiu [#]

    cvs amoxicillin price – buy amoxicillin noscript buy amoxicilin 500 mg online canada

  13. hydroxychloroquine sulfate [#]

    cloroquin https://chloroquineorigin.com/# – hydroxychloroquine how does chloroquine work hydroxychloroquine coronavirus

  14. Akeqct [#]

    generic amoxicillin at walmart’s website – amoxicillin for dogs without vet prescription amoxicillin without a doctor’s prescription

  15. Opfwql [#]

    buy vardenafil 10mg online – 40mg generic vardenafil order vardenafil without prescription

  16. Ekzjxi [#]

    vardenafil 20mg tablets – where to buy vardenafil buy generic vardenafil online

  17. Zhyvth [#]

    buy vardenafil online – vardenafil 10mg buy vardenafil viagra online

  18. generic tadalafil [#]

    tadalafil pills 20mg https://tadalafilgenc.com/ tadalafil pills tadalafil pills 20mg

  19. Dtivqa [#]

    generic vardenafil – canadian pharmacy generic vardenafil buying vardenafil online canada

  20. tadalafil 40 mg daily [#]

    tadalafil dosage https://pulmoprestadalafil.com/ tadalafil generic tadalafil pills 20mg

  21. priruch [#]

    viagra vs cialis vs levitra

  22. tadalafil 30 mg [#]

    tadalafil max dose https://extratadalafill.com/ tadalafil dosage tadalafil 40

  23. tadalafil pills [#]

    generic tadalafil united states https://nextadalafil.com/ tadalafil 60 mg for sale tadalafil

  24. Nddbsy [#]

    canadian pharmacy reviews – http://pharpls.com/# canadian online pharmacy viagra

  25. Wcfqcc [#]

    usa pharmacy – pharmacy canadian canadian drug pharmacy

  26. tadalafil tablets ip [#]

    tadalafil vs vardenafil tadalafil cost walmart tadalafil medication

  27. Abotvx [#]

    tadalafil 22 mg – cialis daily use online cheap cialis online uk

  28. cialis tablets [#]

    cialis tadalafil cheap cialis tadalafil peptides

  29. Xesqkw [#]

    cheapest tadalafil online compare prices – cialis coupons how to buy cialis in india

  30. Hqfktk [#]

    where can you buy viagra without a prescription – 100mg sildenafil prices buy viagra online generic

  31. Vzipuo [#]

    sildenafil 100 coupon – sildenafil 20 mg online pharmacy cheap generic sildenafil citrate

  32. Fvqeus [#]

    buy cialis and vardenafil online – acheter vardenafil vardenafil pill

  33. Gchbua [#]

    buy cialis viagra vardenafil – buy vardenafil online australia buy cialis and vardenafil online

  34. Vpjshg [#]

    vardenafil online pharmacy – cedric vardenafil generic vardenafil cost

  35. Kgzhfp [#]

    valif 20mg generic vardenafil – vardenafil 20 mg generic viagra cialis vardenafil cheap

  36. Twfnlt [#]

    buy stromectol – stromectol canada do i need a prescription for ivermectin

  37. Zhhlen [#]

    buy ivermectin uk – ivermectin 1% ivermectin australia

  38. Pkexbi [#]

    best online viagra site – how to buy viagra from india sildenafil 130 mg

  39. Aqtfbs [#]

    can i buy viagra over the counter in australia – buy viagra online usa no prescription order cheap viagra online

  40. Vnyxck [#]

    buy cialis in australia online – compare tadalafil prices buy cialis uk paypal

  41. Ntswyb [#]

    generic tadalafil uk – online tadalafil 20mg canada cialis otc

  42. Caturi [#]

    buy deltasone pills in united state online – where can i buy prednisone over the counter prednisone 5 tablet

  43. Omjtus [#]

    prednisone 4 – prednisone 9 mg prednisone 200 mg price

Deja tu Comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

CSSLab