롸?
bootstrap 본문
1. 부트스트랩이란?
부트스트랩은 CSS와 자바스크립트 파일로 이루어진 웹 규격을 위한 프레임워크이다. 부트스트랩은 안정적이고, 반응형 웹을 지원하며, 편리하고 버전 단계도 성숙단계에 올라있는 상태이다.
2. 부트스트랩을 사용하는 이유
부트스트랩의 CSS는 웹페이지의 스타일을 초기화 시킨다. 브라우저들마다 각자 다른 기본 스타일을 가지고 있는데 이 스타일들을 초기화 해서 크로스브라우징 문제를 해결한다. 또한 자체적인 폰트 규격과 기본 색상, 여러 UI 컴포넌트들을 기본으로 제공하여 간단히 웹페이지에 붙이듯이 사용할 수 있다.
3. 시작 방법
부트스트랩은 공식 사이트에서 파일을 다운로드 받아서 프로젝트폴더/WebContent에 파일을 밀어넣는 방법도 있지만 그보다 더 간단하게 설치없이 사용할 수 있다.
<head> 아래에 다음의 <link> 태그를 추가한다
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
또 부트스트랩은 jQuery, Popper.js 사용하기 때문에 추가적으로 전체 바디태그가 닫히기 전에 다음의 <script>태그를 추가한다.
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
이후는 부트스트랩이 제공하는 문서를 따라 CSS를 적용하면 된다.
참고
1. https://brunch.co.kr/@clay1987/131
2. https://brunch.co.kr/@clay1987/132
3. https://getbootstrap.com/docs/4.1/getting-started/introduction/
'WEB > 이론' 카테고리의 다른 글
| 웹 서버 vs WAS (0) | 2021.12.07 |
|---|---|
| Ajax란? (0) | 2020.03.10 |
| CGI (0) | 2020.02.25 |
| MIME type (0) | 2020.02.25 |
| HTTP 상태 코드 (0) | 2020.02.25 |
Comments