JavaScript

[JavaScript] Bootstrap 시작하기

helen2ye! 2022. 10. 2. 19:15
  1. google 에 bootstrap 검색
  2. https://getbootstrap.com/ 접속하여 Getting started - Introduction(v5.2) 에서 CSS와 JS 파일을 복붙하기
    CSS는 head tag 안에, JS는 body tag 끝나기 전에 넣어주기
  3. 2번이 어려우면 Include Bootstrap’s CSS and JS를 그대로 가져와서 시작하기
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Bootstrap demo</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-iYQeCzEYFbKjA/T2uDLTpkwGzCiq6soy8tYaI1GyVh/UjpbCx/TYkiZhlZB6+fzT" crossorigin="anonymous">
  </head>
  <body>
    <h1>Hello, world!</h1>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/js/bootstrap.bundle.min.js" integrity="sha384-u1OknCvxWvY5kfmNBILK2hRnQC3Pr17a+RTT6rIHI7NnikvbZlHgTPOOmMi466C8" crossorigin="anonymous"></script>
  </body>
</html>

4. Components - Buttons에서 원하는 버튼 복사해오기

5. 이런 방법으로 Bootstrap을 가져와서 쓰면 된다~

 

 

** 참고강의

https://codingapple.com/ JavaScript 입문과 웹 UI개발