TOPページ >  リンクを貼る, スタイルシート(CSS)の記述 > リンク文字のスタイルを指定する

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

ホームページやブログなどのウェブサイトに、他ページへのジャンプするためのアンカータグを挿入する場合、リンク文字のスタイル指定することができます。一括で指定する場合は、

a { スタイル }

という記述になります。一般の文字の色や文字修飾を指定していても、リンク文字のスタイル指定がないと リンク文字だけはブラウザ依存のスタイル(多くの場合、太い青文字で下線付き)で表示されてしまうので、ページの雰囲気を統一したい場合は、リンク文字のスタイル指定をしたほうが良いでしょう。

例えば、

<style type="text/css">
<!--
.test5 {
background-color:white;
color:black;
}
-->
</style>

というふうに指定していても、一般の文とリンク文字を表示させると、こんなふうになってしまう場合があります。

ここは、一般の文字です。
こちらは、リンクを貼っています

こうした場合、

<style type="text/css">
<!--
.test6 {
background-color:white;
color:black;
}
.test6 a {
text-decoration:none;
color:#A3B8CC;
font-weight:normal;
}
-->
</style>

などと指定すると、リンク文字の体裁を整えることができます。

ここは、一般の文字です。
こちらは、リンクを貼っています

上記サンプルでは classを指定していますが、

<style type="text/css">
<!--
a {
text-decoration:none;
color:#FF00FF;
font-weight:normal;
}
-->
</style>

などとすると、ページ全体のリンク文字のスタイルを指定できます。

ランキングに参加中です! お役に立てたらクリックをお願いします→

同一カテゴリ内一覧
テーブルの余白などのスタイルを指定する
スタイルシートでボタン風リンク文字を表示する
スタイルの共通部分をまとめて記述する
タグを入れ子にして同じクラス/ID名を使い分ける
見出しタグ(H1~H6)のスタイルを指定する
未リンク、訪問済み、リンク中、マウスが重なったときのリンク文字のスタイルを指定する
リンク文字のスタイルを指定する
タグのスタイルを指定する
外部からスタイルシートを読み込む
ページ内で一回だけスタイルを使用する
複数のタグで同一のスタイルを指定する
一時的にスタイルシートを利用
IEの方はこちらから当サイト ブックマークできます。
ランキング参加中!お役に立てたら クリックをお願いします。
当サイト掲載カテゴリは
Yahoo! JAPAN コンピュータとインターネット > データ形式 > HTML > リファレンス