부트 스트랩을 사용하여 웹 사이트를 구축 중이며 다음 문제를 해결하는 가장 좋은 방법은 무엇인지 알 수 없습니다.부트 스트랩 | 반응 형 탐색 표시 줄의 문제
내 탐색 바 왼쪽에는 큰 로고가 있고 오른쪽에는 여섯 개 탐색 항목이 있습니다. XS 화면 크기에서 nav 항목은 제대로 burger 메뉴로 축소됩니다. 그러나 그렇게하기 전에 올바른 동작이 아니어야 로고 아래에 떠있게됩니다.
데모 :이 웹 페이지의 크기를 조정하려고 - 나는 다른 장치가 차이 높이를 갖고 있기 때문에이 최적이 아닌 것으로 나타났습니다하지만 - 스택 오버플로 유사한 문제에>http://stackoverflowquestion.bss.design
하나의 솔루션으로 단순히 붕괴 폭을 변경했다/너비가 보편적이 아닌 줌.
이 문제를 해결하는 가장 좋은 방법은 무엇입니까? 감사합니다
가장 좋은 방법은 과 함께 http://getbootstrap.com/customize/으로 사용자 정의 부트 스트랩을 생성하는 것입니다. 미디어 쿼리 중단 점을 사용하면 몇 가지 다른 것들을 편집 할 수 있습니다. 부트 스트랩 표준 너비 및 기타 매개 변수는 기본 스켈레톤입니다. 언제나 편집 할 수 있습니다.
편집 : 다른 해결책 - 로고를 더 작은 크기로 조정 - 응답 성을 높이고 최대 너비를 사용하십시오.
편집 2 : 미디어 쿼리를 사용하여 로고 컨테이너를 축소하고 로고 이미지를 반응 적으로 유지 - 솔루션을 사용하면 더 낮은 해상도 (화면 -x) 및 화면 -lg/쓰러졌다.
문제는 탐색 모음이 접히는 중단 점에 있습니다. 기본적으로 XS 화면 (예 : < 768px)으로 설정됩니다. 채워진 콘텐츠로 인해 navbar-collapse가 navbar-header 아래에 푸시됩니다.
너비를 변경하여 navbar-collapse 중단 점을 sm 또는 md 화면으로 설정해야합니다. 이 방법으로 어떤 문제도 발견하지 못했습니다.
또는 미디어 쿼리를 사용하여 navbar 요소를 작고 반응 적으로 만들 수 있습니다. 너비가 좁아지면서 네비게이션이 들어갈 수 있도록 로고를 작게 만들 수 있습니다.
CSS를 사용하여 수정할 수 있습니다. navbar에서 최대 높이를 제거하십시오.