Perché i cambiamenti del testo-decorazione non compaiono nella mia animazione CSS?

Question

Voglio emulare un interfaccia utente della console in HTML e ho bisogno di avere una sottolineatura lampeggiante sotto il testo. Il mio approccio è quello di mettere la classe a underblink che ha un'animazione. non compare mai il ciclo di colori, le pelli di testo e rende visibile, ma la sottolineatura. Perché?

CSS:

  @-webkit-keyframes underblink {
    0%     { text-decoration: none;opacity: 0:color :orange }
    50%    { text-decoration: none;opacity: 0;color:green }
    50.01% { text-decoration: underline;opacity: 1 } 
    100%   { text-decoration: underline;opacity: 1 }
  }

  .underblink {
    -webkit-animation: underblink 0.7s infinite linear alternate;
    -webkit-font-smoothing: antialiased;
    display:inline-block;
  }

HTML:

<div id='always_sort_recursively' class='underblink'>x</div>

Answer 1

non appare mai

??... ma la sottolineatura. Perché?

A causa text-decoration non è nella lista di proprietà CSS animatable .