El :only-of-typeselector de pseudoclase en CSS representa cualquier elemento que no tenga hermanos del tipo dado.
p:only-of-type ( color: red; )Si ninguna etiqueta precede al selector, coincidirá con cualquier etiqueta (p :only-of-type. Ej .). Si otro selector lo precede, coincidirá en función del tipo de etiqueta que el selector coincide. Por ejemplo, .example:only-of-typese comportará como p:only-of-typesi .examplese aplicara a un elemento de párrafo.
Ejemplo simple
Una lista contiene solo un elemento de lista. Otra lista contiene tres elementos de lista. Podemos apuntar al elemento de la lista que está solo con :only-of-type.
Aunque quizás ese no sea el mejor ejemplo, porque :only-childfuncionaría igual de bien ya que los elementos de la lista son los únicos hijos posibles de las listas. Si usamos divs en su lugar, podríamos apuntar a un párrafo dentro de un div si es el único párrafo, a pesar de que también hay otros elementos allí.
Notar
Aparte de la diversión, puede lograr la misma selección que :only-of-typecon :first-of-type:last-of-typeo :nth-of-type(1):nth-last-of-type(1). Sin embargo, esos usan dos selectores encadenados, lo que significa que la especificidad es el doble que la de :only-of-type.
Soporte del navegador
| Cromo | Safari | Firefox | Ópera | ES DECIR | Androide | iOS |
|---|---|---|---|---|---|---|
| Alguna | Alguna | Alguna | Alguna | IE9 + | Alguna | Alguna |