「Back to Top」、「詳細を読む」などの短いテキストにはどのタグを使用する必要がありますか？

Question

どのタグを使用する必要がありますか？

トップに戻る

続きを読む

は <p> Appropirateまたは他の何かを使用する必要があります。これらは段落ではないからです。

これはよりセマンティックです

<p><a href="#mainWrapper">Back to top</a></p>

また

<a href="#mainWrapper">Back to top</a>

また

<div><a href="#mainWrapper">Back to top</a></div>

Answer 1

一般に、アンカーを使用する必要があります <a> 鬼ごっこ。

ネスティングan <a> 内側 <p> 完全に有効ですが、一般的に <p> テキストの段落のために予約する必要があります。あなたは単なるリンクなので、 <a> タグだけが最も推奨されるでしょう。

リンクをブロック要素として表示したい場合は、単にスタイルを整えます display: block;. 。という事実 <a> タグは通常、インラインで表示されます。これは、デフォルトスタイルであるためにのみです。

Answer 2

アンカータグ

<a href="#">Back to top</a>

<a href="#">Read more</a>

ブロック要素内にアンカータグを埋め込むことができます。だからこのようなもの

<p><a href="#">Back to top</a></p>

Answer 3

インライン要素はブロックレベルの要素内で囲む必要があるため、これが基本的なアプローチです。

<p><a href="#">Back to top</a></p>

通常 <a> 要素はすでに内部にあります <div> タグしてください <p> 絶対に必要ではありませんが、それはより意味的に正しいです。たとえ単語が数個しかない場合でも、それはまだテキストの段落です。

Answer 4

そのような明らかなセマンティックタグはありません。

• たぶん、あなたは本当にそこにタグを必要としないでしょう！このケースを確認してください。

• あなたの「短いテキスト」がリンクである場合、あなたは明らかに必要です <a href=. 。テキストにCSSスタイルが必要な場合は、 a タグも。

*構造化のみにタグが必要な場合、またはCSSスタイルをハングするためにタグが必要な場合は、使用してください。 <span>.