通常のリンクを変える

上部
さて、ここからは、スタイルシートを使ってリンクのデザインを変える方法を説明していくよ。


普通は、リンクは青い文字で、下に線が引いてありますよね。

上部
うん。その通りだね。リンクのデザインを変えるには、「a:link」を使うんだよ。

例えば、リンクの文字を赤色にしたい場合、スタイルシートに次のように書こう。

a:link{color:#ff0000;}

さらに、リンクの文字の背景を薄い黄色にしたい場合、スタイルシートに次のように書こう。

a:link{
  color:#ff0000;
  background-color:#999999;
}

さらに、今までに勉強した、枠線を付けたり、余白を指定することで色々リンクのデザインを変更する事が出来るよ。


なるほど〜!色々工夫できそうですね!

上部
一つ注意しておいて欲しいのは、さっき学君が言っていたようにリンクは青文字で下線が引いてあるものだと思っている人もいるので、それ以外のデザインにするとリンクだと気付かれない可能性もあるという事だね。


確かにそうかもしれませんねぇ・・・。気をつけます!

SEO [PR] 爆速!無料ブログ 無料ホームページ開設 無料ライブ放送