일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
Tags
- DatePicker
- SWiFT
- amazon
- 전의 의존성
- 함수
- CKEditor4
- 상속
- bootstrap
- EC2
- AWS
- 제어문
- guard
- 사용법
- switch-case
- 옵셔널
- programmers
- pagination
- 2차원 객체배열
- Spring
- 객체
- jQuery
- Java
- Gradle
- 차이점
- PHP
- class
- 클래스
- Xcode
- 자료불러오기
- CodeIgniter
Archives
- Today
- Total
not bad 한 개발
Bootstrap - 소개 본문
Bootstrap은 웹 개발할 때 사용되는 프레임워크로 PC뿐만 아니라 모바일 화면으로 볼 때 UI를 자동으로 정렬해주는 기능이 있어서 많이 사용되는 프레임워크 중에 하나입니다. Bootstrap에서는 자체적으로 사이트를 운영하여 사용법을 알려주고 있습니다, Bootstrap은 버전이 현재 3,4,5 버전 이렇게 3가지가 개발되었는데 3,4는 사용해보니 확실히 3보다는 4에 기능이 좀 더 많이 있어서 다양한 기능을 만들 수 있었습니다, 5는 최근에 개발되어 아직은 사용해보지는 않았지만 좀 더 개발되면 사용해보고 싶습니다.
https://getbootstrap.com/docs/versions/
위의 링크에서 사용하고 싶은 버전을 선택한 후
Quick start 에서 Head to the downloads page 링크를 클릭하면 다운로드 페이지가 나옵니다.
Compiled CSS and JS에 있는 Download 버튼을 누르면 지정한 버전의 Bootstrap 파일이 Download 됩니다.
다운로드를 하면
이렇게 나옵니다, 이중에 bootstrap.css 와 bootstrap.js 파일을 지정된 폴더로 복사한 후 link태그의 src부분에 파일을 저장한 링크를 작성하면 Bootstrap기능을 사용할 수 있습니다, 별도로 bootstrap.js 파일을 사용하려면 jquery도 같이 link 시켜야 합니다.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<!--jQuery CDN-->
<link rel="stylesheet" href="/<지정된 링크>/bootstrap.css">
<!--CSS-->
<script type="text/javascript" src="/<지정된 링크>/bootstrap.js"></script>
<!--JS-->
'Web > Bootstrap' 카테고리의 다른 글
Bootstrap - pagination 디자인 변경 (0) | 2022.03.06 |
---|---|
Bootstrap - Cross fade (0) | 2022.01.10 |
Bootstrap - grid 시스템 (0) | 2021.12.30 |
Comments