너는 어떻게 navbar-collapse 높이 bootstrap 4를 바꾸는가?

부트 스트랩을 사용하여 전체 높이가 & 인 전체 높이 메뉴가있는 웹 사이트를 만들려고합니다. 너는 어떻게 navbar-collapse 높이 bootstrap 4를 바꾸는가?

<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="true" aria-label="Toggle navigation"> 
    <span class="navbar-toggler-icon"></span> 
</button> 
<div class="navbar-collapse collapse"> 
    <ul class="navbar-nav"> 
     <li class="nav-item"><a title="Home" href="#" class="nav-link">Home</a></li> 
     <li class="nav-item"><a title="Home" href="#" class="nav-link">Home</a></li> 
     <li class="nav-item"><a title="Home" href="#" class="nav-link">Home</a></li> 
    </ul> 
</div>

내가 클릭

네비게이션 바에-toggler 내가 스타일 = 보았다 collapse.show 간략하게 네비게이션 바에 붕괴 붕괴 "높이 : 160 픽셀을"하고는 사라졌다.

navbar-collapse collapse.show가 전체 높이가되도록하려면 어떻게해야합니까?

모든 포인터가 크게 감사하겠습니다. 내가 제대로 이해하면

출처

2017-09-26 Sariyanta Made

사용자 정의 css에서 height : 100vh를 사용하여 .collapse.show 규칙을 재정의하려고 했습니까? –

그랬지 만 결과는 메뉴가 두 번 움직이는 것입니다. 160px까지의 첫 번째 애니메이션과 두 번째 애니메이션이 전체 화면을 채 웁니다. 하나의 애니메이션으로 만 만들려고합니다. –

부트 스트랩의 javascript 메소드가 navbar .collapse에 바인드되어있을 수 있습니다. (juste가 직접 테스트했습니다.) 가장 좋은 기회는 부트 스트랩의 스크립트를 사용하지 않고 처음부터 직접 만들 수 있다는 것입니다. –

, 그럼 난 당신이 navba-붕괴 사업부 내의 다른 사업부를 넣어이를 수 있다고 생각하고 화면이 그것을 높이를 증가시키는 작은 경우 해당 대상 :

<div class="navbar-collapse collapse"> 
    <dvi class="adjust-height"> 
    <ul class="navbar-nav"> 
     <li class="nav-item"><a title="Home" href="#" class="nav-link">Home</a></li> 
     <li class="nav-item"><a title="Home" href="#" class="nav-link">Home</a></li> 
     <li class="nav-item"><a title="Home" href="#" class="nav-link">Home</a></li> 
    </ul> 
    <div> 
<div>

의 높이를 조정 "adjust-height"의 클래스를 원하는대로 선택하십시오.

출처

2017-09-26 18:00:47 Laiman

너는 어떻게 navbar-collapse 높이 bootstrap 4를 바꾸는가?

답변

관련 문제