Heim >Web-Frontend >CSS-Tutorial >CSS-Implementierung der laufenden Punkteffekt-Codefreigabe

CSS-Implementierung der laufenden Punkteffekt-Codefreigabe

巴扎黑
巴扎黑Original
2017-08-22 17:26:111737Durchsuche

Dieser Artikel stellt hauptsächlich die Wirkung von CSS vor. Der Code ist angehängt, um es allen zu erleichtern, die Stileinstellungen zu verstehen. Interessierte Freunde können sich darauf beziehen.

Der Code lautet wie folgt:


<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>进行中...</title>
<style>
dot {
  display:inline-block;
  width:3ch;
  text-indent:-1ch;
  vertical-align:bottom;
  overflow:hidden;
  animation:dot 3s infinite step-start both;
}
@keyframes dot {
  33% { text-indent: 0; }
  66% { text-indent: -2ch; }
}
</style>
</head>
<body>
<a href="javascript:">进行中<dot>...</dot></a>
</body>
</html>

Das obige ist der detaillierte Inhalt vonCSS-Implementierung der laufenden Punkteffekt-Codefreigabe. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel:CSS-Fähigkeiten-LinkanmerkungNächster Artikel:CSS-Fähigkeiten-Linkanmerkung