CSS 基本チュートリアルの疑似クラス セレクター

CSS 疑似クラスセレクター: ハイパーリンクにスタイルを追加します (リンクのさまざまな状態にスタイルを追加します)

ハイパーリンクには 4 つの状態があります:

通常の状態 (:link): マウスはアクティブではありません前にリンクしたスタイルを置きます。

ホバー状態 (:hover): リンク上にマウスを置いたときのスタイル。

アクティブ状態 (:active): マウスの左ボタンを放さずに押し続けます。この状態は特に短時間です。

訪問ステータス (:visited): マウスの左ボタンを押してポップアップすると、スタイル効果が表示されます。

日常の作業では、次の記述方法を使用してリンクにさまざまなスタイルを追加します。

a:link, a:visited{ color:#444; } //「通常の状態」を変更します。 「訪問ステータス」を 1 つにまとめます。

a:hover{ color:#990000; text-decoration:underline; } //「マウスオーバー」で 1 つの効果を作成します


学び続ける
||
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>php.cn</title> </head> <style type="text/css"> .box { height:30px; border:1px solid red; padding:10px; } .box a:link,.box a:visited{color:#66ff88;text-decoration:none; }/*将“正常状态”和“访问过的状态”合二为一。*/ .box a:hover{color:#ff0000;text-decoration:underline;}/*“鼠标放上”单做一种效果*/ </style> <body> <div class="box"> <a href="#">欢迎来到php.cn</a>| <a href="#">首页</a>| <a href="#">课程</a>| <a href="#">问答</a>| <a href="#">手记</a> </div> </body> </html>
  • おすすめコース
  • コースウェアのダウンロード
現時点ではコースウェアはダウンロードできません。現在スタッフが整理中です。今後もこのコースにもっと注目してください〜
私たちについて 免責事項 Sitemap
PHP中国語ウェブサイト:福祉オンライン PHP トレーニング,PHP 学習者の迅速な成長を支援します!