부트 스트랩을 사용하는 반응 CSS 규칙

Question

휴대 기기에서 내 사이트의 일부 크기를 줄이기를 원합니다. 페이지 너비에 따라 반응 형 CSS 규칙을 수동으로 추가하는 대신 부트 스트랩에 의해 이러한 변경 사항을 트리거 할 수 있습니까?

예를 들어 시행 착오를 통해 bootstrap3이 고정 너비에서 가변 너비로 전환되고 브라우저 너비가 767px보다 작을 때 navbar이 접힐 때마다 축소되었음을 알았습니다. 내 페이지의 다른 요소들을 동시에 스타일링하고 싶습니다./부트 스트랩 반응 규칙에서 상속 트리거 방식이 변경 사항이있는 천연/자연적인 방법 대신 수동으로

@media screen and (min-width: 767px) 

Answer 1

가장 좋은 방법을 추가하는, 거기에 당신의 코드에서 부트 스트랩의 클래스를 통합하는 것입니다. 또한 장치별로 콘텐츠를 표시하거나 숨기려면 유틸리티 클래스를 사용하십시오. 그들은 숨기거나 이러한 클래스로 지정된 화면 크기에 DIV 년대를 표시합니다 :

.visible-phone 
.visible-tablet 
.visible-desktop 
.hidden-phone  
.hidden-tablet 
.hidden-desktop 

(전화 767px을 아래, 정제 768px로 979px).

이 업데이트 : 상황이 변경되었습니다 이번 주 부트 스트랩 새 버전이 다른 클래스가 있습니다

올드 = .visible 전화 = 새로운 .visible-SM을

올드 = .visible 태블릿 새로운 = .visible- MD

오래 = .visible 데스크톱 .visible-LG = 새로운

올드 = .hidden 전화 새로운 = .hidden-SM

올드 = .hidden 태블릿 새로운 =의 - 안녕 dden 복합 지구

올드 = .hidden 데스크톱 새로운 = .hidden-LG

더 많은 변화가 쉽게 the migration guide

업데이트에서 볼되어 새로운 클래스 '볼'을 찬성 사용되지 않습니다부터 시작 CSS 표시 속성을 제어하는 ​​클래스 bootstraps explanation