div内の classのリンクのつけ方

締切済

質問者：ahoutori
質問日時：2010/03/31 15:30
回答数：3件

<body class="thrColFixHdr">
<div id="header">
<div id="headerIn">
<div class="logo">店名</div>
<h1>ようこそ</h1>
</div>
</div>

ホームページの一番上の部分です。
http://www.goo.ne.jp/
上記サイトのように左上にロゴが入っており、
お店ページのロゴをクリックしたら、上記ページと同じようにトップページに戻るようにしたいのですが、
class="logo"にリンクをつけても反応してくれません。
それ以外にググって色々調べましたが、どうしても方法が分りません。
初歩的な質問かもしれず、恐縮ですがご教授いただければ幸いです。

通報する

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

質問の本文を隠す

回答 (3件)

最新から表示
回答順に表示

No.3

回答者： nbafreak
回答日時：2010/04/24 23:34

<div style="float:left;">ロゴ画像</div><div style="float:right;">ようそこ</div>

<div style="clear:both;"></div>

としてください。
<div style="clear:both;"></div>
を忘れると何かとぶっ壊れますので注意です^^

- 0
- 件

通報する

No.2

回答者： ORUKA1951
回答日時：2010/03/31 16:49

bodyにclassは不要でしょう。

HTML内にはbodyは一つ(かつ必須)しかないので。
A要素は、inline要素しかないようにもてません。次にブロック要素が現れるとその直前で閉じられていると解釈しなければならない事になっています。
すなわち、<a href="[URL]"><div></div>と書かれていた場合は、
<a href="[URL]"></a>
<div></div>
と解釈することが決められています。
【引用】＿＿＿＿＿＿＿＿＿＿＿＿ここから
<!ELEMENT A - - (%inline;)* -(A) -- anchor -->
￣￣￣￣￣￣￣￣￣￣￣￣￣ここまで［Links in HTML documents (ja)( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )］より
　これは、この要素には(inline要素)のみ含みうると読みます。
　また、
7.5.3 ブロックレベル要素と行内要素 ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )はHTML作成で最初に学ぶべき最も重要な概念です。【この説明がないマニュアルはゴミ箱直行だね】
★？と思ったら、仕様書に目を通す癖をつけましょう。そしたら覚えられる。
★下記で検証済みHTML4.01strictです。
　Another HTML-lint gateway ( http://openlab.ring.gr.jp/k16/htmllint/htmllint. … )
　W3C CSS 検証サービス ( http://jigsaw.w3.org/css-validator/#validate_by_ … )

<!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 http-equiv="Content-Style-Type" content="text/css">
<link rev="made" href="mailto:hoge@hoge.com" title="send a mail" >
<link rel="START" href="../index.html">
<style type="text/css">

</style>

</head>
<body>
<div>
<a href="./index.html"><img src="http://www.goo.ne.jp/img2/logo/gh_logo2.gif" width="115" height="63" alt="ロゴ" class="Logo" ></a>
<h1>サンプル</h1>
<p>こんな感じです。幅60％、ウィンドウ幅を変えると、ウィンドウ幅によって最小500px、最大800px内で変化する。ログは左上に絶対配置となっている。</p>
<p class="test">ブラウザの横幅を変更しても、内容が左右真中に表示されています</p>
</div>
</body>
</html>

この回答への補足

大変詳細なアドバイスを頂き深く感謝いたします。
ご教授に従い早速変更を進めておりますが、もう少しのところで詰まっております。
下記のように変更したのですが、今までと表示が逆になってしましました。
前　　　　　ロゴ　ようこそ
改編後　　ようこそ　　ロゴ

<div>の場所を変更してたり<div align="left">を入れたりしたのですが、
いちばん左にロゴ　その右横にようこそという文章にしたいのですが、
お手数ですがご教授いただければ幸いです。

知識不足を痛感しORUKA1951様のよりお教えいただきましたアドレスをもとに、勉強に励みたいと思います。

<body class="thrColFixHdr">
<div id="header">
<div id="headerIn">
<div><a href="http://www.yahoo.com/"><img src="../new/img/logo.gif" border="0" alt="ロゴ"></a>
<h1>ようこそ</h1>
</div>
</div>