Warum werden in meiner CSS-Animation nicht textablösende Änderungen angezeigt?

Question

Ich möchte eine Konsolen -Benutzeroberfläche in HTML emulieren und muss einen Unterstrich im Text blinken lassen. Mein Ansatz ist es, die Klasse zu unterblinden, die eine Animation aufweist. Der Farbenzyklus, der Text verbirgt und unheilt, aber die Untersteuerung erscheint nie. Wieso den ?

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

... aber die Untersteuerung erscheint nie. Wieso den ?

Da text-decoration ist nicht in der Liste der animatierbaren CSS -Eigenschaften.