부트 스트랩 CSS가 작동하지 않음 (Navbar)

Question

demo.mobilifytech.com에서 부트 스트랩을 사용하여 웹 사이트를 만들려고합니다. navbar 코드가 아무 것도 작동하지 않습니다. 부트 스트랩 웹 사이트에서 코드를 정확히 복사했는데 여전히 그 코드를 수행하지 않습니다.

내 문제는 다음과 같습니다

1. Navbar를 자동 상관없이 화면 크기 축소된다.
2. 배경색이 변경되지 않고 텍스트 색이 변경되지 않습니다. (예 : navbar-inverse, bg-inverse)

무엇이 문제의 원인인지 잘 모르겠습니다. 이것은 내가 부트 스트랩에서 복사 한 코드 demo.mobilifytech.com

<nav class="navbar navbar-toggleable-md navbar-light bg-faded"> 
    <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> 
    <span class="navbar-toggler-icon"></span> 
    </button> 
    <a class="navbar-brand" href="#">Navbar</a> 

    <div class="collapse navbar-collapse" id="navbarSupportedContent"> 
    <ul class="navbar-nav mr-auto"> 
     <li class="nav-item active"> 
     <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a> 
     </li> 
     <li class="nav-item"> 
     <a class="nav-link" href="#">Link</a> 
     </li> 
     <li class="nav-item"> 
     <a class="nav-link disabled" href="#">Disabled</a> 
     </li> 
    </ul> 
    <form class="form-inline my-2 my-lg-0"> 
     <input class="form-control mr-sm-2" type="text" placeholder="Search"> 
     <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button> 
    </form> 
    </div> 
</nav> 

에서 라이브를 확인하시기 바랍니다, 내가 확장 클래스를 사용하여 시도했지만 그것이 해결되지 않습니다.

Answer 1

귀하의 <nav> 요소에 navbar-toggleable-md 대신 navbar-expand-md을 사용하십시오.

Answer 2

코드가 누락되었습니다. navbar-expand-lg이 클래스 .navbar-expand{-sm|-md|-lg|-xl} 버튼의 내용이 버튼 뒤에 접힐 때 변경되는 클래스입니다.

<nav class="navbar navbar-toggleable-md navbar-expand-lg navbar-light bg-faded">