ナビゲーションバーをどのように構成すればよいですか？

Question

私はこのようなナビゲーションバーを作成したい：

がどのように私はそのようなことを構造化でしょうか？明らかに、青い背景を持つ1つの外部divが存在するはずです。しかし、子要素はどうですか？彼らはどのように構造化されるべきですか？ありがとう。ナビゲーションバーを作成するには

Answer 1

、あなたはこれが一般的にナビゲーションバーを構築するための最も一般的な方法と考えられるので、

* { 
 
    margin: 0; 
 
    padding: 0; 
 
} 
 

 
nav { 
 
    background-color: blue; 
 
    color: white; 
 
    font-family: Arial; 
 
    padding: 30px 40px; 
 
} 
 

 
ul { 
 
    list-style-type: none; 
 
} 
 

 
li { 
 
    display: inline-block; 
 
    width: 49%; 
 
    text-align: right; 
 
} 
 

 
li.title { 
 
    text-align: left; 
 
}

<nav> 
 
    <ul> 
 
    <li class="title">Welcome to Our World</li> 
 
    <li>We Work Best</li> 
 
    </ul> 
 
</nav>

のようなものが必要になります。

Answer 2

ページを正しく構成する方法に関する一般的な回答はありません。テクノロジを使用するための一般的な標準がありますが、ページを正しく表示することは、使用する要素の数や種類を決定する上で重要です。

たとえば、ページのサイズを自動的に変更したい場合は、DivsまたはTablesを使用します。ページ全体を横切らずにテキストを折り返したい場合は、テーブルを使用することもできます。

CSSのフローティングへの参照を表示できます...しかし、このタイプの例でもdiv内にdivを作成することができます。divは適切に「味付け」するスタイルです。スパンをスパン内で使用することもできます。

http://www.w3schools.com/css/css_float.asp

このexplinationへの主要な注意点は、企業環境が正常にeccomerseまたはクライアント現在のサイト、およびデータがどのように表現されるかが決まります広告やマーケティングによって生成されたスタイルガイドを持っているということです。これは、通常、Divs vs Spansのようにexとして使用するよう強制します。

Answer 3

各要素には異なるデフォルトの表示プロパティがありますので、この場合は要素によって異なります。スパンの 表示プロパティはインライン

される - インライン要素は

のようなインラインインラインインライン

ように水平ラインアップのdivの表示特性が

https://iamarunkumar.wordpress.com/2010/02/10/what-is-the-default-display-property-for-span-and-div/