個別にハイパーリンクの色を指定するには？

解決済

質問者：JPSOMJGVFBWZ
質問日時：2013/04/04 22:05
回答数：2件

例えば
<body link="red">
とした場合、クリック前のリンクの色はすべて赤になりますが、ある特定のリンクのみ緑にしたい場合
どのようなタグを書けばいいのでしょうか？

<body link="red">
<a href="http://www.yahoo.co.jp/">test</a>
</body>

a要素に何を付け足せばいいか教えてください。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (2件)

No.2ベストアンサー

回答者： naokita
回答日時：2013/04/05 03:21

<body link="red">は非奨励ですね・・・

CSSで、（CSSの書き方は検索しましょう）
a:link{color:red;}

直接書く場合
<a href="http://www.yahoo.co.jp/" style="color:green;">test</a>

または、個別のCSS
HTML
<a href="http://www.yahoo.co.jp/" class="sample1">test</a>
CSS
a.sample1:link{color:green;}

#1さんの方法など、色々なセレクタがあります。

----------------
以下なども面白い効果ですよ。
a:hover{color: lime; text-decoration: none; font-size: 116%; font-weight: bold; background-color:yellow;}

- 0
- 件

通報する

この回答へのお礼

ありがとうございました。

通報する

お礼日時：2013/04/12 20:28

No.1

回答者： ORUKA1951
回答日時：2013/04/04 23:07

<body link="red">

<a href="http://www.yahoo.co.jp/">test</a>
</body>
はないでしょう。linkは非推奨です。スタイルシートで指定しましょう。
｛link = color [CI] 推奨しない。( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )｝
また<body>内に直接Aは置けません。

スタイルシートを使えば、自由自在に好きにデザインできます。
【引用】＿＿＿＿＿＿＿＿＿＿＿＿ここから
スタイルシートはHTMLのマーク付けを簡素化し、またHTMLをプレゼンテーションの負担から大きく解放する。スタイルシートは、著者とユーザに対し、フォント情報、配置、色等の文書のプレゼンテーションを制御する手段を提供する。
￣￣￣￣￣￣￣￣￣￣￣￣￣ここまで［Introduction to HTML 4 (ja)( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )］より

★　⇒Another HTML-lint 5( http://www.htmllint.net/html-lint/htmllint.html )
のDATA(右上)で検証済みのHTML4.01strict+CSS2.1です。
　HTML書いたら必ずチェックすること。上達の早道です。
★タブは＿に置換してあります。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="ja">
<head>
＿<meta http-equiv="content-type" content="text/html; charset=Shift_JIS">
＿<title>サンプル</title>
＿<meta name="author" content="ORUKA1951">
＿<meta http-equiv="Content-Style-Type" content="text/css">
＿<link rev="made" href="mailto:oruka1951@hoge.com" title="send a mail" >
＿<link rel="START" href="../index.html">
＿<style type="text/css">

＿</style>
</head>
<body>
＿<div class="header">
＿＿<h1>タイトル</h1>
＿＿<p><a href="/">Top</a></p>
＿＿<p><a href="/Product">Products</a></p>
＿＿<p><a href="/Book">Books</a></p>
＿＿<p><a href="/Link">Links</a></p>
＿</div>
＿<div class="section">
＿＿<h2>見出し</h2>
＿＿<p>・・・</p>
＿</div>
＿<div class="footer">
＿＿<h2>文書情報</h2>
＿＿<dl class="documentHistry">
＿＿＿<dt id="FIRST-PUBLISHED">First Published</dt>
＿＿＿<dd>2012-08-10</dd>
＿＿</dl>
＿＿<address>© ORUKA1951 2012 - 2016 All Rights Reserved mailto:*****</address>
＿</div>
</body>
</html>