> 웹 프론트엔드 > 부트스트랩 튜토리얼 > 부트스트랩에 기본적으로 열이 12개만 있는 이유는 무엇입니까?

부트스트랩에 기본적으로 열이 12개만 있는 이유는 무엇입니까?

藏色散人
풀어 주다: 2023-02-08 11:47:10
원래의
2374명이 탐색했습니다.

12는 숫자 "1, 2, 3, 4, 6"의 최소 공배수이기 때문에 부트스트랩은 기본적으로 12개 열만 지정할 수 있습니다. 따라서 12열 그리드 시스템은 비교적 유연하며 행을 1열로 나누는 것을 지원합니다. 2열, 3열, 4열, 6열.

부트스트랩에 기본적으로 열이 12개만 있는 이유는 무엇입니까?

이 튜토리얼의 운영 환경: Windows 7 시스템, bootstrap3 버전, Dell G3 컴퓨터.

Bootstrap에는 왜 기본적으로 12개의 열이 있나요?

오늘 다음과 같은 질문을 받았습니다. "Bootstrap의 기본값이 12열인 이유에 대해 궁금한 적이 있습니까?"

글쎄요. 저는 한동안 Bootstrap을 사용해 왔지만 왜 Bootstrap의 기본값이 12열인지 생각해 본 적이 없습니다. 12열이라 좀 모호한데, 보통 2블록, 3블록, 4블록으로 나누는 게 더 편하기 때문인 것 같아요.

가설이 있으므로 아직 증명이 필요합니다.

Google에서 검색하는 중입니다.

Contrary to the question’s parenthetical, Bootstrap was always at 940px wide, and not 960px, even with the original 16 columns. With the switch to 12 columns in Bootstrap 2, we wanted to simplify the overall grid (16 columns is right on the edge of enough granularity) and make it easier to get three columns.
로그인 후 복사

일반적인 의미는 원래 16열이었으나 나중에 3열을 더 쉽게 배열하기 위해 12열로 변경되었다는 뜻입니다.

그럼 질문은 이전에는 왜 16개의 기둥을 설계했느냐는 것입니다.

Google로 이동하세요.

16-columns has long been the go-to grid for designers and developers, but we’ve noticed a shift to 12- and 24-columns to offer a more flexible layout. And they’re right for doing so—gridded layouts work best with an odd number of columns (you often see three columns, but four or six are not that popular).
로그인 후 복사

이것은 Bootstrap의 github 버그 목록에 대한 2011년의 토론입니다. 제목은 왜 24개의 열이 아닌 16개의 열이 사용되었는지 묻는 것입니다. 16개 열 앞에 24개 열이 있는 것으로 나타났습니다. 대략적으로 말하면 개발자와 디자이너에게는 16개 열이 첫 번째 선택이지만 12개 또는 24개 열이 더 유연할 수 있습니다. 그중 홀수열의 레이아웃이 더 일반적이다. 예를 들어 3열의 레이아웃을 흔히 볼 수 있다.

여기서 왜 16열이 개발자와 디자이너의 첫 번째 선택인지 모르겠습니다. 하지만 나중에 3열 레이아웃이 더 일반적이라고 언급했는데, 실제로 그렇습니다. 예를 들어 CSDN의 홈페이지에는 3열 레이아웃이 있습니다. 16열로 3:1이나 3:2로 나누는 것은 그리 편리하지 않습니다.

그리고 12는 1, 2, 3, 4, 6의 최소공배수이므로 12열 그리드 시스템은 비교적 유연하며 행을 1열, 2열, 3열, 4열, 6개의 열. 5개의 열을 지원하려면 1, 2, 3, 4, 5의 최소 공배수는 60이고 숫자 60은 그리드 시스템에 비해 너무 큽니다.

추천: "부트스트랩 비디오 튜토리얼"

위 내용은 부트스트랩에 기본적으로 열이 12개만 있는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿