2つのリンクを垂直に表示するだけで、どの方法が好まれますか？

StackOverflow https://stackoverflow.com/questions/2409290

質問

2つのリンクを垂直に表示するだけで、どの方法を互いに上回っていますか？コンテンツページ（ナビゲーションとしてではありません）。

これ（弾丸は必要ありませんが）

<p>
   Lorem Ipsum is simply dummy text of the printing and typesetting industry. 
   Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, 
   when an unknown printer took a galley of type and scrambled it to make a 
   type specimen book.
</p>
<ul>
   <li><a href="#">Link 1</a></li>
   <li><a href="#">Link 2</a></li>
</ul>

これ

<p>
   Lorem Ipsum is simply dummy text of the printing and typesetting industry. 
   Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, 
   when an unknown printer took a galley of type and scrambled it to make a 
   type specimen book.
</p>
<p><a href="#">Link 1</a></p>

<p><a href="#">Link 2</a></p>

またはこれ 

<p>
   Lorem Ipsum is simply dummy text of the printing and typesetting industry. 
   Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, 
   when an unknown printer took a galley of type and scrambled it to make a 
   type specimen book.
</p>
<p> <a href="#">Link 1</a> 
    <br />
   <a href="#">Link 2</a>
</p>
役に立ちましたか？

解決

プレゼンテーション目的で使用するマークアップ、それがCSSの目的について心配するべきではありません。上記の例はすべて、あなたが望むように簡単に見えるようにスタイルを整えることができます。決定する必要があるのは、コンテンツが何であるかです は 適切にマークアップします。

マークアップがコンテンツを説明していることを忘れないでください。これは、グループに意味があるリンクのリストですか？そのマークアップは関連するもののリストを説明するため、リストを使用します。リンクはコンテンツに無関係ですか？リストを使用しないでください。リストは相関を意味します。

セマンティクスは、非常に主観的な性質のために時々決定するのが難しいです。そうは言っても、実際にコンテンツを意味的にマークアップしてから、プレゼンテーションニーズにCSSを使用する必要があります。

他のヒント

それは完全にコンテキスト、IMOに依存します。リンクがメニューにある場合は、順序付けられていないリストアプローチを使用します。それらが論理的に分離されている場合、私はそれらをそれぞれ自分の容器に入れます。それらが論理的に関連しているが、私が彼ら自身のラインでそれらを望んでいるなら、私はおそらくそれらを適切にスタイリングしたCSSで要素をブロックするでしょう。通常、私はBRタグを避けます。

意味的には、スタイリングを容易にするために、最初のオプションを使用します。

箇条書きが必要ない場合は、スタイルを整えてください LI 彼らがいなければ （list-style-type:none).

私は言うでしょう

<ul style="list-style-type: none">
   <li><a href="#">Link 1</a></li>


   <li><a href="#">Link 2</a></li>
</ul>

私はリストタグの下にあるものを好みます。私にとっては、それはよりクリーンなコードで、フォームに簡単に配置できます。

ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top