센터링되어 있고 다른 화면 크기에 맞게 고정 점 이동 막대를 만들려면 어떻게해야합니까?

Question

나는이 웹 사이트 전체에서 신참이다. 나는 happycog.com/의 것과 비슷한 skicky 네비게이션 바를 만들고 싶습니다. 네비게이션에 7 또는 8 개의 링크가 있습니다. 누구든지 멍청한 놈을 도와 줄 수 있습니까? 이 문서의 많은이 지역 사회 꽤 큰로서

Answer 1

나는 당신이 css와 html을 의미한다고 생각한다.

HTML

<div class="navbar">8 li items</div> 

CSS

.navbar { 
width:100%; 
position:fixed; 
top:0; 
} 

당신은 포함 된 요소에게 폭 (아래 'HTML'100 %에 이르기까지)을 제공해야합니다.

Answer 2

당신은 Foundation

또는 Bootstrap

그것은 쉽게 같은 프레임 워크를 시작할 수는 다음을 시작합니다.

Answer 3

먼저 980 또는 1180 픽셀과 같이 지정된 너비를 가진 8 개의 링크 모두에 대해 컨테이너가 필요하다는 것을 알아 두십시오. 또한 부모 컨테이너 (링크 컨테이너가있는 컨테이너)의 너비는 브라우저의 현재 길이와 같아야합니다.

링크 컨테이너가 <div id="links-container">이고 <a href="#">Home</a><a href="#">Contact Us</a> 등을 포함한다고 가정 해 보겠습니다. 링크 컨테이너의 부모는 body 태그입니다. - 그게 다 HTML을위한 것입니다, 이제 우리는 우리가 CSS로 사용할 스타일링으로갑니다. 튜토리얼을 찾아 그것을 스타일 속성 (인라인 또는 CSS)에

.links-container { 
    // this will make the container float 
    // at the center of its parent container 
    margin:0 auto; 
    // this will set the container's width 
    // if not set, it will inherit its parent's width 
    width:980px; 
}