リンク・アンダーライン・特定・スタイルシート・ホームページ作成

ホームページ作成の後

検索エンジン対策(SEO)
検索エンジン集
相互リンクを増やす
アフィリエイト
ページ作成時必須ツール
インターネット便利ツール
おすすめの本
広告を出す

その他

ホームページ作成(気楽版)
アフィリエイト(詳細版)
管理人コラム
レンタルサーバー比較初心者
メルマガバックナンバー
無料レポート、無料冊子
顔文字無料辞書
ホームページ(サイト)マップ
検索エンジンWorldSearch
運営者情報

リンク集

簡単相互リンク
相互リンクモスト

リンクについて
相互リンク・リンク集系
情報・ショップ系 2 3
法律・生活系
ビジネス・お小遣い系 2
趣味・地域情報系
コンピュータ・ネット系 2
美容・健康・女性系 2

特定のリンクだけアンダーライン(下線)を表示する

プロパティ　text-decoration:
値　underline

スタイルシートで特定のリンクだけにアンダーラインを表示するにはtext-decoration:プロパティを使います。

値にはunderlineを指定します。

セレクタを指定するときに a.line のようにすれば

aタグでlineというクラス名がついている箇所だけにスタイルが適用できるのを覚えていますか？

今回はそれを使います。

表示例はこちら

ソース

<html>
<head>
<title>ホームページ作成・サンプル２</title>
<style type="text/css">
a { text-decoration:none; color:red; }
a.line { text-decoration:underline; color:green; }
</style>
</head>
<body>
<a href="../specific.html">戻る</a>
<br><br>
<a href="../../../index.html">ホームページ作成・HTML</a>
<br><br>
ページ全体で見るとリンクのアンダーラインがなくなり色が赤になりました。
<br><br>
<a href="../../index.html" class="line">スタイルシート書き方講座</a>
<br><br>
ここのリンクだけアンダーラインがあり、緑色になっています。
</body>
</html>

＜＜　「リンクの文字のアンダーラインをなくす」へ　　　　　「マウスがリンクの上に乗ったらアンダーラインを表示する」へ　＞＞

ホームページ作成とHTML＞＞スタイルシートの書き方講座＞＞特定のリンクだけアンダーラインを表示する