파운데이션을 사용하는 Bootstrap, 프론트 엔드 개발자를 사용하는 개발 엔지니어. 이유에 대해 이야기합시다.
부트 스트랩과 기초에는 많은 주요 차이점이 있지만, 한 가지만 기억하면됩니다.
Zurb와 Twitter의 두 가지 디자인 개념은 자신의 프레임 워크의 이름으로 볼 수 있으므로 매우 분명합니다. Bootstrap은 부트 스트랩, 부트 스트랩을 의미합니다. 즉, 프로젝트에 필요한 모든 것을 처리하려고합니다. 기초는 창조, 창조, 즉 프로젝트에서 강력한 창의성을 제공한다는 것을 의미합니다.
이 견해를 유지하면 이제 둘 사이의 주요 차이점을 더 많이 나열하겠습니다.
1. UI 요소
Foundation은 몇 가지 제한된 요소 만 준비하는 반면 Bootstrap은 상상할 수있는 모든 요소를 제공합니다.
Foundation의 Zurb의 설계 목표는 사전 정의 된 UI 요소를 사용하더라도 웹 사이트와 너무 비슷하지 않아야한다는 것입니다.
반면에 Bootstrap은 정의 된 모든 UI 요소를 제공하려고합니다.
2. REMS 대 픽셀
Foundation은 Rems를 사용하고 Bootstrap은 픽셀을 사용합니다 .
픽셀을 사용한다는 것은 다른 장치가 디스플레이 효과에 큰 차이를 갖는 경향이 있기 때문에 높이, 너비, 내부 마진, 구성 요소의 외부 마진 및 각 장치 및 화면 크기를 정확하게 정의해야한다는 것을 의미합니다.
이제 Foundation 5는 em이 아닌 REMS를 사용합니다. 이것은 EM 캐스케이드 문제를 피합니다.
REMS를 사용하면 글꼴 크기를 사용할 수 있습니다 : 80%; 전체 구성 요소와 하위 구성 요소를 20%줄입니다.
REMS를 사용하면 픽셀의 세부 사항을 제거 할 수 있으므로 REMS를 사용하여 처리하는 것이 좋습니다.
Foundation은 또한 SASS의 혼합 방법을 제공하여 픽셀을 REM으로 변환하여 픽셀 사고 방법을 계속 사용하여 페이지를 정의 할 수 있습니다.
.element {너비 : rem-calc (10px); // rems로 변환됩니다}3. 유연한 그리드 대 사전 정의 된 그리드
Foundation의 그리드는 현재 브라우저의 너비에 자동으로 적응할 수 있습니다. Boostrap은 주류 장치 및 화면에 적응하기 위해 여러 그리드 크기를 사전 정의했습니다.
Bootstrap은 브라우저 너비를 변경하면 갑자기 그리드를 변경합니다.
Foundation은 현재 브라우저 너비에 유연하게 적응합니다. 이것은 새로운 기술 방법입니다. 자동으로 적응하는 동안 변압기와 동일한 효과를 수행 할 수 있습니다.
Foundation은 그리드가 변경 될 때 두 가지 핵심 사항이 있습니다 : 소규모, 중간 및 대형. 모든 작업은 현재 브라우저의 너비에만 줄어들고 확대되고 조정됩니다. 사전 정의 된 화면 크기는 필요하지 않으며, 더 중요한 이유는 화면 크기에 따라 다른 스타일을 정의하는 것이 좋습니다.
부트 스트랩을 사용하면 고정 또는 매니 폴드 메쉬가 발생하므로 메쉬 컨테이너의 미리 정의 된 너비를 설정 여부를 설정해야합니다.
Foundation 및 Sass를 사용하면 가장 큰 그리드의 크기 (중간 및 작은 그리드가 자동으로 계산 됨), 큰 화면의 열 수 및 작은 화면의 열 수를 자유롭게 조정할 수 있습니다.
4. 모바일 장치는 선호되는 것과 모바일 장치도 지원됩니다.
Foundation은 4 코너 스크린을 염두에두고 설계되었습니다. Bootstrap은 휴대 전화, 태블릿, 데스크탑 및 대형 스크린이있는 데스크탑으로 사전으로 디자인되었습니다 .
모바일 장치를 지원하는 모바일 우선 웹 사이트를 구축하면 더 큰 화면에서 사용할 수 있습니다. 따라서 Foundation 은이 작업을 수행하도록 권장합니다. 모바일 최초.
Foundation의 Sass Media Query Mixin을 사용하는 경우 모바일 장치가 무엇인지 쿼리하기위한 특정 미디어 쿼리가 없지만 미디어 쿼리를 사용하여 더 큰 화면에 표시 방법을 정의합니다.
사물을 설계 할 때 처음으로 데스크탑 컴퓨터를 고려하면 작은 화면을 지원할 때 큰 문제가 발생할 수 있습니다. 먼저 휴대 전화를 고려하면 사용자에게 가장 중요한 내용에 중점을두고 공간 감각을 높일 수 있습니다.
5. 커뮤니티
부트 스트랩에는 더 큰 커뮤니티가 있습니다. 그리고 기초를 사용하면 더 자립해야합니다.
부트 스트랩의 가장 큰 하이라이트는 커뮤니티입니다. 그것은 매우 거대하고 포괄적이며 원하는 거의 모든 것을 찾을 수 있습니다.
기초를 선택하면 자립이 마스터해야 할 것일 수 있습니다. 거의 모든 솔루션은 부트 스트랩을위한 것이며 직접 구축 할 수 있습니다.
결론적으로
몇 가지 질문을 스스로에게 물어보십시오.
무언가가 더 유용하거나 더 생생한 것을 원하십니까?
자신의 CSS를 구성하고 기본 구성 요소로 만들고 싶습니까?
답은 : 부트 스트랩입니다. 기반 .
여전히 심도있게 공부하고 싶다면 여기를 클릭하여 3 가지 흥미로운 주제를 공부하고 첨부 할 수 있습니다.
부트 스트랩 학습 튜토리얼
부트 스트랩 실용 튜토리얼
부트 스트랩 플러그인 사용 튜토리얼
이것은 흥미로운 비교입니까? 모든 사람들이 프론트 엔드 프레임 워크 부트 스트랩 3 및 기초 5를 이해하는 것이 도움이되기를 바랍니다.