Bootstrap

bootstrap이란?

• css를 불러오고, 해당 파일에 정의된 버튼 레이아웃 등을 가져와서 사용.
• 클래스로 간단하게 불러와서 사용.
• 트위터에서 개발
• 사용법 : bootstrap cdn검색 ->다른버전 사용시 Old versions -> Bootstrap -> v3 검색

---

버전 3과 4의 차이

• 3 - px단위 / 4 - em단위
• 4버전 부터는 IE8 이하 버전 지원 종료

3을 쓰는 이유

• summer노트 등 부트스트랩 플러그인(기반 플러그인) 둥 아직 3버전에 머물러 있는 플러그인이 많기 때문이다.
• 나중에 4버전을 사용했을 때도 무리없이 동작한다면 4버전을 사용해도 무방하다.

---

작성 시

• bootstrap을 작성시에는 한줄은 container로 감싸고 시작한다

---

레이아웃

• .col-sm-$ (sm: small device) – 한중은 12개로 나뉘어 있음

.col-sm-2	한줄에 여섯개
.col-sm-3	한줄에 네개
.col-sm-3	한줄에 세개
.col-sm-3	한줄에 두개

---

col-sm-	768px 보다 클 때
col-md-	970px 보다 클 때
col-lg-	1170px 보다 클 때
col-xs-	1170px 보다 클 때

---

Bootstrap template

https://themeforest.net/search/bootstrap (유료)
https://startbootstrap.com/themes (무료)

패스트파이브 정리파일에 폼, 테이블, 버튼 등 작성해둔거 확인

---

이 글은 패스트캠퍼스 '프론트엔드(React)올인원패키지Online'을 수강하며 정리한 노트입니다.
https://fastcampus.co.kr/search?keyword=%ED%94%84%EB%A1%A0%ED%8A%B8%EC%97%94%EB%93%9C