エントリーの編集
![loading...](https://b.st-hatena.com/bdefb8944296a0957e54cebcfefc25c4dcff9f5f/images/v4/public/common/loading@2x.gif)
エントリーの編集は全ユーザーに共通の機能です。
必ずガイドラインを一読の上ご利用ください。
CSS/JavaScriptで1文字ずつをアニメーションさせる
記事へのコメント0件
- 注目コメント
- 新着コメント
このエントリーにコメントしてみましょう。
注目コメント算出アルゴリズムの一部にLINEヤフー株式会社の「建設的コメント順位付けモデルAPI」を使用しています
![アプリのスクリーンショット](https://b.st-hatena.com/bdefb8944296a0957e54cebcfefc25c4dcff9f5f/images/v4/public/entry/app-screenshot.png)
- バナー広告なし
- ミュート機能あり
- ダークモード搭載
関連記事
CSS/JavaScriptで1文字ずつをアニメーションさせる
文字をアニメーションさせて目立たせるやり方です。 見出しに使ったりワンポイントに使ったりいろいろで... 文字をアニメーションさせて目立たせるやり方です。 見出しに使ったりワンポイントに使ったりいろいろできると思います。 この記事では以下のpタグの文字をアニメーションさせていきます。 <p id="text">あいうえお</p> 文字の色を変える まずは簡単な色を変えるアニメーションです。 #text { animation: color-loop 1s infinite; } @keyframes color-loop { 0% { color: red; } 50% { color: blue; } 100% { color: red; } } 「animation: color-loop 1s infinite」はcolor-loopを1秒間で繰り返し(infinite)行うという意味です。 @keyframesは時間のどの割合の時に何を変更するかを指定します。赤から50%で青になり10