• ベストアンサー
※ ChatGPTを利用し、要約された質問です(原文:「アンカーテキスト」について)

HTMLチェックサイトでのアンカーテキストのエラーとは?

このQ&Aのポイント
  • HTMLチェックサイトを使用してHTMLチェックをしたところ、アンカーテキストを作成して内部リンクを張る箇所でエラーが発生しました。
  • エラーメッセージによると、<div>タグの中に<a>タグを書くことはできないとのことです。
  • ホームページ作成が初めてであり、SEO対策も分かっていないため、アンカーテキストに関して教えていただきたいです。

質問者が選んだベストアンサー

  • ベストアンサー
  • ORUKA1951
  • ベストアンサー率45% (5062/11036)
回答No.2

 A自体すでに要素なのでその要素をデザインするためのdivは無論、spanも不要です。  HTMLでは、すべての要素にブロック要素とインライン要素があります。HTMLを学ぼうとするとき最初に覚えなければならない重要項目です。  ご利用のマニュアルにその説明がなければ、まずそのマニュアルはゴミ箱に直行ですね。  CSSのマニュアルで、セレクタや詳細度の説明がないのも同じ程度に屑ですけどね。   ★ブロック要素はそれがひとつの文章の集合であることを示すもので、ブラウザでは前後にマージンをとった改行で示されます。 ★インライン要素は、行内で特定の文字列などをマークアップします。当然、基本的に内部にブロック要素を持つことはありません。  DIVは汎用ブロックと呼ばれるもので、内部にブロック要素を持ちます。インライン要素ももてますが、あくまで「インライン要素も含められる」ぐらいに考えたほうが良いですね。通常は使う機会のない要素ですが、スタイルシートでデザインするときは極めて有益なので使いますが、マニュアルによると多様が目立つものがあのます。  A要素は、インライン要素です。 【引用】____________ <!ELEMENT A - - (%inline;)* -(A) -- anchor -->  ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ここまで[12.2 A要素/HTML4仕様書(ja)( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/struct/links.html#edef-A )]より  この意味は、内部にインライン要素しかもてないということです。 ★仕様書はいつでも参照できるようにブックマークの最初に登録しておくこと  あなたの示されたHTML、CSSはあまりに修正箇所が多くて、すべてを指摘しませんが、 [きちんと子孫セレクタで指定しましょう]  それだけで、文書構造上まったく無意味なidやclassは不要になる。 【サンプルソース】   Another HTML-lint gateway ( http://openlab.ring.gr.jp/k16/htmllint/htmllint.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>Untitled</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"> <!-- div#sub { float: left; width: 226px; margin-left: 37px; } div#sub ol{ padding-bottom: 10px; border-style: solid; border-color: #FF7F00; border-width: 0px 1px 5px 1px; padding-left:0px; } #sub li{ margin-left:0px; list-style:none; width:100%; } #sub li a { color: #FF7F00; text-decoration: none; border-bottom: 1px dotted #FF7F00; display:block; width: auto; text-align: right; padding-right:1em; } #sub li a:hover { background: #f5f5f5; } --> </style> </head> <body> <h1>title</h1> <div id="sub"> <h2>subTitle</h2> <ol> <li><a href="syurui.html#okyaku1">O脚</a></li> <li><a href="syurui.html#okyaku1">X脚</a></li> <li><a href="syurui.html#okyaku1">Y脚</a></li> </ol> </div> </body> </html>  

その他の回答 (1)

  • askaaska
  • ベストアンサー率35% (1455/4149)
回答No.1

> <div>~</div>内に<a> <div>の代わりに<span>を使うといいわ。

関連するQ&A