Bootstrap 3에서 반응 형 그리드를 얻는 방법은 무엇입니까?
Twitter Bootstrap을 사용하여 웹 애플리케이션에 반응 형 디자인 기능을 추가해야합니다. 나는 단지 반응 형 동작을 원하고 타이포그래피, 구성 요소 또는 부트 스트랩에 포함 된 다른 것들에 관심이 없습니다.
내가 가지고 사용자 정의 부트 스트랩 버전 바로 그리드 시스템을 선택합니다. 그러나 생성 된 CSS를 애플리케이션에 추가하면 모든 스타일 (헤더, 링크 및 기타)이 엉망이됩니다. 왜 그럴까요? 그리드 시스템만으로 부트 스트랩 CSS를 얻으려면 어떻게해야합니까? 부트 스트랩 파일의 수동 수정을 피하고 싶습니다.
http://getbootstrap.com/customize/로 이동 하여 BS3 프레임 워크에서 원하는 것을 전환 한 다음 "컴파일 및 다운로드"를 클릭하면 선택한 CSS 및 JS를 얻을 수 있습니다.
CSS를 열고 그리드를 제외하고 모두 제거합니다. 여기에는 일부 정규화 항목도 포함됩니다. 그리고 사이트의 모든 스타일을 box-sizing : border-box- http ://www.w3schools.com/cssref/css3_pr_box-sizing.asp로 조정해야합니다.
체크 아웃 zirafa / 부트 스트랩 그리드 전용 . 여기에는 필요한 부트 스트랩 그리드 와 반응 형 유틸리티 만 포함되어 있으며 (재설정 또는 기타 없음) LESS 파일로 직접 작업 하는 복잡성 을 단순화 합니다 .
Grid system
"반응 형 유틸리티"를 선택 하고 다음을 제공합니다. http://jsfiddle.net/7LVzs/
Bootstrap 3.3.5 그리드로만 Grunt 빌드를 만들었습니다.
https://github.com/horgen/grunt-builds/tree/master/bootstrap-grid
최대 10KB가 최소화되었습니다.
Bootstrap에서 다른 부분이 필요하면 /src/less/bootstrap.less에 포함하십시오.
대신 MDO의 http://getpreboot.com/을 사용하는 것이 좋습니다 . v2 preboot
부터는 부트 스트랩 3.0 그리드 시스템을 만드는 데 사용되는 LESS 믹스 인 / 변수를 백 포팅하며 CSS 생성기를 사용하는 것보다 훨씬 가볍습니다. 사실, 포함 preboot.less
만하면 전체 파일이 믹스 인 / 변수로 구성되어 있으므로 최종 출력이 아닌 사전 컴파일에만 사용되므로 오버 헤드가 없습니다.
이제 Bootstrap 4s의 새로운 다운로드 기능에서 그리드 만 다운로드 할 수있는 것 같습니다.
이 질문을 한 지 오래되었지만 이제는 Bootstrap을 완전히 포기하고 CSS Grid를 사용할 수 있습니다! (더 간단하고 깔끔하며 더 유연하고 빠릅니다). 이 멋진 기사를 참조하십시오 : Bootstrap 사용 중지 — 구성 요소 기반 UI를위한 실용적인 CSS 그리드 템플릿 만들기
참고 URL : https://stackoverflow.com/questions/20403443/how-to-get-just-the-responsive-grid-from-bootstrap-3
'Programming' 카테고리의 다른 글
Jest 테스트를 순차적으로 실행하는 방법은 무엇입니까? (0) | 2020.08.07 |
---|---|
cmd.exe에서 영구 환경 변수 설정 (0) | 2020.08.07 |
ASP.NET Core에서 현재 HttpContext에 액세스 (0) | 2020.08.07 |
C #을 사용하여 현재 활성 창의 제목을 어떻게 얻습니까? (0) | 2020.08.07 |
Firebase에서 데이터를 구조화하는 가장 좋은 방법은 무엇인가요? (0) | 2020.08.07 |