スタイルシートでリンクを装飾してみよう

スタイルシートでリンクを装飾してみよう

リンクを装飾する
  1. リンクのスタイルを指定する
  2. リンクの擬似クラスを指定する
  3. リンクに背景色を指定する

リンクのスタイルを指定する

CSSコード ブラウザ表示画面
リンクの文字を大きくする
リンクの色を指定する
リンクを太字にする
リンクの下線をなくす
HTMLコード
コンテンツメニューに戻る

リンクの擬似クラスを指定する

CSSコード ブラウザ表示画面

擬似クラスを指定したリンク

a:link → まだ見ていないリンク
a:visited → すでに見たリンク
a:hover → カーソルを上に乗せた状態(アクティブでない)
a:active → カーソルが上にあり、クリックされている状態(アクティブ)

HTMLコード
コンテンツメニューに戻る

リンクに背景色を指定する

CSSコード ブラウザ表示画面
リンクに背景色を指定する
HTMLコード
コンテンツメニューに戻る
このエントリーをはてなブックマークに追加
Yahoo!ブックマークに登録
Clip to Evernote

メールを送る

ご質問やご意見ご感想はこちらのフォームをお使いください。

SEO [PR] @J[hr ₦΍@ Cu`bg SEO