Bootstrap

Bootstrap은 html 코드 개발에 도움을 주는 front endframework입니다.

Bootstrap의 특징에 대해 알아 봅시다.

향상된 기본 HTML 구성 요소의 스타일

HTML Tag브라우저 기본 스타일Bootstrap 스타일
input

select
button

위 예시 외에도 모든 HTML 태그들의 향상된 스타일을 제공하며 모든 브라우저에서 동일하게 표현될 수 있게 해줍니다. CSS 작업을 해보면 종종 스타일이 브라우저에 따라 다르게 보이는 경우가 있어서 문제가 되기도 하죠.

HTML에서 기본으로 제공하지 않는 다양한 Component들의 제공

Tabs:

Breadcrumb:

등등 기본 HTML에서 제공하지 않는 다양한 component들을 제공합니다.

모든 component들은 https://getbootstrap.com/docs/4.4/components 에서 볼 수 있습니다.

Responsive website(반응형 웹사이트)를 쉽게 만들 수 있음

Responsive website(반응형 웹사이트)는 화면의 크기에 맞춰 사이트의 구성이 알맞게 조절되는 사이트를 뜻합니다. 즉 하나의 페이지가 컴퓨터, 테블릿, 스마트폰 등 화면 크기가 다른 모든 환경에서 보기좋게 나올 수 있다는 뜻이죠.

Bootstrap이 유명해진 큰 이유가 Bootstrap를 써서 쉽게 반응형 웹사이트를 만들 수 있기 때문입니다.

1
2
3
4

이 뿐만 아니라 화면 사이즈에 따라 특정한 HTML element의 사이즈를 바꾸거나, 숨기거나 등등 다양한 일들을 할 수 있습니다.

혹시 이 글을 읽으면서, '난 위에 말 한거 나 혼자 다 만들 수 있는데?' 라고 생각하실 수도 있겠지만, 위에 기능들을 못만들어서 Bootstrap을 사용하는 것이아니라, Bootstrap을 사용하면 정말 빠르고 쉽게 만들 수 있기 때문에 사용하는 것입니다.

https://getbootstrap.com/docs 를 보고 공부합시다.

댓글

댓글쓰기

이 글에 댓글을 다시려면 SNS 계정으로 로그인하세요. 자세히 알아보기

UP