2012-05-01 15 views
1

私は、ページと同じ幅のナビゲーションバーを作成する方法を探していました。リンクが均等に出ています。私は、これら二つの場所として見てきました:中央のナビゲーションバーとリンク

http://www.w3schools.com/css/tryit.asp?filename=trycss_navbar_horizontal_float_advanced http://www.cssnewbie.com/full-width-centered-navigation-bar/

彼らは一種の助けるが均等に広がっリンクについては説明しません。どちらも左または右に浮動します。これに関する援助は非常に感謝しています。

答えて

2

私はあなたの質問を理解している場合は、パーセントで作業する必要があります。

ここで速い例:あなたは5つの項目の幅で、25%にそれぞれLI幅を設定する必要があり、リスト内の4つの項目と

ul { 
 
    width: 100%; 
 
    display: inline-block; 
 
    background: green; 
 
} 
 

 
ul li { 
 
    float: left; 
 
    width: 25%; 
 
    text-align: center; 
 
}
<ul> 
 
    <li><a href="">LINK 1</a></li> 
 
    <li><a href="">LINK 2</a></li> 
 
    <li><a href="">LINK 3</a></li> 
 
    <li><a href="">LINK 4</a></li> 
 
</ul>

がように20%となります...

0

私が知る限り、要素が均一に広がる唯一の方法は、幅が100%の<table>を使用することです。他のすべてのソリューションでは、リンクの数が異なる可能性があるため、わからない可能性がある幅をパーセントで指定する必要があります。

これ以外にも、JavaScriptを使用してbroserのビューポートの幅を指定することができます。 see this blog entry

関連する問題