Limited support 注意が必要。一部のブラウザのみ対応。プロダクション利用は慎重に判断すること。

text-decoration-line: blink

text-decoration: blink は歴史的なHTML <blink> タグのCSS版であり、テキストを点滅させます。ただし、現代のほぼすべてのブラウザでは実際の点滅動作は実装されておらず、宣言は受け入れられるものの視覚的効果はありません。アクセシビリティの観点からも使用は強く非推奨です。

非推奨テキスト装飾

対応ブラウザ

機能 デスクトップ モバイル
Chrome
Edge
Firefox
Safari
Chrome Android
Safari iOS
css.properties.text-decoration-line.blink
非推奨
57
79
26
8
57
8
1+対応 (バージョン) 未対応 ※注釈あり サブ機能の解説は MDN Web Docs (CC BY-SA 2.5)
注釈 1件
実装メモ
  • 「blink」値は何の効果もありません。
注釈 1件
実装メモ
  • 「blink」値は何の効果もありません。
注釈 1件
実装メモ
  • 「blink」値は何の効果もありません。
注釈 1件
実装メモ
  • 「blink」値は何の効果もありません。

基本構文

CSS 
/* Deprecated - Disabled in most browsers */
.blink {
  text-decoration: blink;
}

ライブデモ

Blink(non-recommended)

CSS Blink(non-recommended) demo.

プレビュー全画面表示

Cssalternative(animation)

CSS CSSalternative(animation) demo.

プレビュー全画面表示

Comparison: Normaltext

CSS comparison: normaltext demo.

プレビュー全画面表示

実務での使いどころ

  • レガシーコードの理解

    古いWebサイトのコードベースで text-decoration: blink に遭遇した際の理解と、代替手段への移行の参考にします。

注意点

  • ほぼすべてのブラウザで点滅効果は無効化されています。代替としてCSSアニメーションを使用できますが、点滅自体が推奨されません。

アクセシビリティ

  • WCAG 2.2.2 では点滅するコンテンツの自動停止を求めており、テキストの点滅は視覚障害や光過敏性発作のあるユーザーに悪影響を与えます。

参考リンク