ウェブページの上部に固定されたHTMLナビゲーションバー、水平ボックス（ボタン）

ウェブページの上部に表示するナビゲーションバーを取得しようとしています。水平ボタンはクリーンボックスの内側にあります。 navbarとよく似ています（http://www.apple.com/）。私はこのようにする方法を知っているかのように感じますが、明らかに私はそうしません。どんな助けでも非常に高く評価されています。ありがとう、私はこれまでのコードです。 Cssが最初に表示され、次にHTMLが表示されます。ウェブページの上部に固定されたHTMLナビゲーションバー、水平ボックス（ボタン）

body{ 
 
    border: solid; 
 
    background-color: white; 
 
    color: black; 
 
    text-align: center; 
 
} 
 

 
table.slideshow{ 
 

 

 
} 
 
th.slideshowtitle{ 
 
    text-align: center; 
 

 
} 
 

 
footer{ 
 
    border-top: solid 10px; 
 

 

 
} 
 

 
/*nav bar*/ 
 
.navbar-inverse { 
 
    background-color:black; 
 
}

<!DOCTYPE html> 
 

 
<html> 
 

 
<head> 
 
    <link href="C:\Users\Chester Szydlowski\Desktop\HOF\stylesheet.css" type="text/css" rel= "stylesheet" /> 
 
<title> 
 
    Hall Of Framers 
 
</title> 
 
</head> 
 
<body> 
 

 
<nav class ="navbar navbar-inverse navbar-fixed-top"> 
 
     <div class="container"> 
 
     <div class="navbar-header"> 
 
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar"> 
 
      <span class="icon-bar"></span> 
 
      <span class="icon-bar"></span> 
 
      <span class="icon-bar"></span> 
 
      <span class="icon-bar"></span> 
 
      <span class="icon-bar"></span> 
 
      <span class="icon-bar"></span> 
 
      </button> 
 
     </div> 
 
     <div id="navbar" class="collapse navbar-collapse"> 
 
      <u1 class="nav navbar-nav"> 
 
      <li class="active"><a href="#">Home</a></li> 
 
      <li><a href="C:\Users\Chester Szydlowski\Desktop\HOF\public_html\EmailList.html">Email List</a></li> 
 
      <li><a href="">Custom Frames</a></li> 
 
      <li><a href="">News</a></li> 
 
      <li><a href="">Silent Auction</a></li> 
 
      <li><a href="">Upcoming and Past Events</a><li> 
 
      <li><a href="">i dont know</a></li> 
 
     </u1> 
 
    </div> 
 
    </div> 
 
</nav> 
 

 

 
<p> Products </p> 
 

 
</table> 
 
</body>

出典

2016-05-25 Chester S.

あなたは 'position：fixed;'を持っていますか？あなたのCSSで、または私は上記の唯一のCSSですか？あなたのjavascriptはどこですか？ – mlegg

あなたが「LI」要素に表示CSSセレクタを追加した場合、それは

があなたのCSSに以下を追加トリックを行います。

li{ 
    display:inline-block; 
    }

これで、要素を隣り合わせに移動し、そこからさらにスタイルを変更できます。幸運

出典

2016-05-25 01:03:16 Noah

ありがとう！これはすぐに働いた。 –

問題はありません！さらなるスタイリングの手助けが必要な場合はお知らせください。 – Noah

あなたのnavがboostrapクラスを使用しているようです。その場合は、ダウンロードしてboostrap.cssを含めてください。

出典

2016-05-25 01:19:40 citysurrounded

私はブートストラップのクラスに慣れていないので、これを調べます、ありがとう！ –

ウェブページの上部に固定されたHTMLナビゲーションバー、水平ボックス（ボタン）

答えて

関連する問題