LESS를 사용하지 않고 Bootstrap Navbar 축소 중단점을 어떻게 변경할 수 있습니까?

LESS 없이 Bootstrap Navbar 축소 중단점을 조정하는 방법

Bootstrap 3 navbar는 브라우저 너비가 768px 아래로 떨어지면 기본적으로 축소됩니다. 이 중단점은 CSS 재정의를 사용하여 사용자 정의 값으로 조정할 수 있습니다. LESS를 사용하지 않고 이를 수행하는 방법은 다음과 같습니다.

Bootstrap 5(2023 업데이트)

• 절대로 축소되지 않는 navbar의 경우 .navbar-expand를 추가하세요. class.
• 항상 접히는 탐색바의 경우 사용하지 마세요. .navbar-expand.

Bootstrap 4(2018 업데이트)

• .navbar-expand-* 클래스를 사용하여 원하는 breakpoint.

  • .navbar-expand-sm: 576px 이하로 접기
  • .navbar-expand-md: 768px 이하로 접기
  • .navbar-expand-lg: 아래 접기 992px
  • .navbar-expand-xl: 1200px 이하로 접기
  • .navbar-expand: 절대 접지 않음
  • (확장 클래스 없음): 항상 접기
• 사용자 정의 중단점의 경우 다음을 사용하세요. CSS:

@media (min-width: 1300px) {
  .navbar-expand-custom {
    flex-direction: row;
    flex-wrap: nowrap;
    ...
  }
}

Bootstrap 3(2018 이전)

• 다음 CSS로 기본 중단점을 재정의합니다.

@media (max-width: 991px) {
  .navbar-header {
    float: none;
  }
  ...
}

• 바꾸기 "991px"를 원하는 중단점으로 설정하세요.

참고:

• 위 방법은 모든 페이지의 기본 동작을 재정의합니다.
• 기기별 미디어 쿼리를 사용하여 다양한 기기의 다양한 중단점을 타겟팅할 수 있습니다.
• 기억하세요 웹사이트의 다른 측면을 손상시키지 않도록 변경 사항을 철저히 테스트합니다.

위 내용은 LESS를 사용하지 않고 Bootstrap Navbar 축소 중단점을 어떻게 변경할 수 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!