CSS 擬似クラスと擬似要素を指定するサンプル

2022年12月1日

環境
Google Chrome　107.0.5304.122（Official Build）（64 ビット）
Windows 10 Home 64bit

書式
a:link::before
擬似クラスのa:lilnkと擬似要素の::beforeを指定しています。
構文
擬似クラス::擬似要素
擬似クラスと擬似要素を指定します。

使用例

<!DOCTYPE html>
<html>
<head>
<style>
/* 擬似クラスのa:lilnkと擬似要素の::beforeを指定 */
a:link::before {
      content:" ようこそ"; 
      color:red;
}

</style>
</head>
<body>
<p>test data</p>
<p><a href="javascript:void(0);">東京</a></p>
</body>
</html>

結果
文字「ようこそ」の文字色が赤になります。

CSS

Posted by arkgame

関連記事: