Pseudo-clases CSS con estilos en línea

¿Es posible tener pseudo-clases usando estilos en línea?

Ejemplo:

<a href="http://www.google.com" style="hover:text-decoration:none;">Google</a>

Sé que el HTML anterior no funcionará, pero ¿hay algo similar que lo haga?

PD: Sé que debería usar una hoja de estilo externa, y lo hago. Tenía curiosidad por saber si esto podría hacerse usando estilos en línea.

No, esto no es posible. En los documentos que utilizan CSS, un styleatributo en línea solo puede contener declaraciones de propiedades; el mismo conjunto de declaraciones que aparece en cada conjunto de reglas en una hoja de estilo. De la especificación de atributos de estilo :

El valor del atributo de estilo debe coincidir con la sintaxis del contenido de un bloque de declaración CSS (excluyendo los corchetes delimitadores), cuya gramática formal se proporciona a continuación en los términos y convenciones de la gramática central CSS :

declaration-list
  : S* declaration? [ ';' S* declaration? ]*
  ;

Ni los selectores (incluidos los pseudoelementos), ni las reglas, ni ninguna otra construcción CSS están permitidos.

Piense en los estilos en línea como los estilos aplicados a un selector de ID súper específico anónimo: esos estilos solo se aplican a ese mismo elemento con el styleatributo. (También tienen prioridad sobre un selector de ID en una hoja de estilo, si ese elemento tiene esa ID.) Técnicamente no funciona así; esto es solo para ayudarlo a comprender por qué el atributo no admite estilos de pseudo-clase o pseudo-elemento (tiene más que ver con cómo las pseudo-clases y los pseudo-elementos proporcionan abstracciones del árbol de documentos que no se pueden expresar en el idioma del documento).

Tenga en cuenta que los estilos en línea participan en la misma cascada que los selectores en los conjuntos de reglas, y tienen mayor prioridad en la cascada ( !importantno obstante). Por lo tanto, tienen prioridad incluso sobre los estados de pseudo-clase. Permitir pseudo-clases o cualquier otro selector en estilos en línea posiblemente introduciría un nuevo nivel en cascada, y con ello un nuevo conjunto de complicaciones.

Tenga en cuenta también que las revisiones muy antiguas de la especificación de atributos de estilo originalmente propusieron permitir esto , sin embargo, se descartó, presumiblemente por la razón mencionada anteriormente, o porque implementarla no era una opción viable.

No CSS, sino en línea:

<a href="#" 
   onmouseover = "this.style.textDecoration = 'none'"
   onmouseout  = "this.style.textDecoration = 'underline'">Hello</a>

Ver ejemplo →

En lugar de necesitar en línea, puede usar CSS interno

<a href="http://www.google.com" style="hover:text-decoration:none;">Google</a>

Podrías tener:

<a href="http://www.google.com" id="gLink">Google</a>
<style>
  #gLink:hover {
     text-decoration: none;
  }
</style>

Puedes probar https://hacss.io :

<a href="http://www.google.com" class=":hover{text-decoration:none;}">Google</a>

Manifestación