부트 스트랩 탐색 막대 위에 전체 너비 이미지 추가

Question

navbar 위에 이미지를 삽입하려하지만 나에게 적합하지 않습니다.

<div class="wrapper" /> 
    <div class="navbar"> 
    <div class="navbar-inner"> 
     <div class="container"> 
     <ul class="nav"> 
      <li class="active"> 
      <a class="brand" href="#">Home</a> 
      </li> 
      <li><a href="#">About</a></li> 
      <li><a href="#">Portfolio</a></li> 
      <li><a href="#">Contact</a></li> 
     </ul> 
     </div> 
    </div> 
    </div> 

내 CSS : 여기 내 HTML입니다 내가 사업부 또는 내용을 추가

.wrapper { 
    background-image: url(../assets/bridge.jpg); 
    background-repeat: no-repeat; 
    background-size: 100% 100%; 
    width: 100%; 
    height: 250px; 
} 

언제, 그것은 페이지 상단에 푸시됩니다. 패딩을 추가 할 수는 있지만 화면의 크기를 조정하기 시작하면 이미지와 탐색 막대에 간격이 생겨 나뭇잎이 생깁니다. 어떤 도움이라도 좋을 것입니다.

Answer 1

<div />은 HTML5에서 <div>을 의미하고 XHTML에서와 마찬가지로 <div></div>을 의미하지 않습니다. Div 님은 유효한 자동 닫기 태그가 아닙니다.

Demo

<div class="wrapper"></div> 
<div class="navbar"> 
    <div class="navbar-inner"> 
     <div class="container"> 
     <ul class="nav"> 
      <li class="active"> 
      <a class="brand" href="#">Home</a> 
      </li> 
      <li><a href="#">About</a></li> 
      <li><a href="#">Portfolio</a></li> 
      <li><a href="#">Contact</a></li> 
     </ul> 
     </div> 
    </div> 
    </div> 

Answer 2

.wrapper의 끝에 문제는 />입니다. 허용되지 않으므로 (귀하의 doctype에 따라 다름) 그것을 제거하고 </div> 다른 divs처럼, 나는 그것이 작동 할 것 같아요.