CSS: Selectores

  1. Escriba el selector apropiado para las descripciones que se hacen a continuación:

    1. Los párrafos de la clase alerta.

    2. Cualquier elemento de la clase alerta e importante

    3. Las celdas normales y de cabecera de la tabla de clase elementos.

    4. Las celdas normales y de cabecera de la tabla con identificador principal.

    5. Los enlaces a recursos accesibles mediante el protocolo ed2k.

    6. El seudoelemento que antecede a los enlaces referidos en el punto anterior.

    7. Los elementos input de sólo lectura.

    8. Elementos article que contienen encabezados de nivel 2.

    9. Los enlaces sobre los que se pasa el ratón.

    10. El seudoelemento que sucede a los enlaces referidos en el punto anterior.

    11. El primer hijo de un elemento section.

    12. Las celdas de las filas impares de la tabla de la clase elementos.

    13. La primera, cuarta, séptima, etc. celdas de la tabla de la clase elementos.

    14. Empezando por atrás, lo mismo del apartado anterior.

    15. El párrafo que sigue inmediatamente a un encabezado de nivel 3.

    16. El pseudoelemento marker de ítems de listas numeradas o no numeradas, las cuales son hijas de un elemento article.

    17. Abreviaturas sin atributo title.

    18. Todas las celdas de filas pares excepto la última (celda, no fila).

    19. El primer carácter del término de una lista de definiciones.

    20. Las celdas no vacías de la tabla con identificador principal.

  2. Calcule justificadamente cuál de los selectores tiene más especifidad:

    1. Regla CSS que se aplica con:

      [id] a.externo { /* ... */ }
      a[href] { /* ... */ }
      p a { /* ... */ }
      
    2. Regla CSS que se aplica con:

      .tabla :is(td, th) { /* ... */ }
      table :where(td, th):hover { /* ... */ }
      .tabla :where(td, th):hover { /* ... */ }
      
    3. Regla CSS que se aplica con:

      h1 + p>ol[class] { /* ... */ }
      [id] ol.listita li { /* ... */ }
      .seccion ol li { /* ... */ }
      
    4. Regla CSS que se aplica con:

      #a1 :is(ol, ul) :where(ol, ul).interna li { /* ... */ }
      #a1 :is(ol, ul) :is(ol, ul) li { /* ... */ }
      section :is(ol, ul).externa :is(ol, ul).interna li { /* ... */ }
      
    5. Regla CSS que se aplica con:

      form fieldset :invalid { /* ... */ }
      .formulario :where(fieldset, div) input:invalid { /* ... */ }
      .formulario input:invalid { /* ... */ }