Development

부트스트랩(Bootstrap)을 소개합니다!

주말만기다려·2017년 6월 21일·조회 2,921

1. 부트스트랩이란

"부트스트랩은 반응형이며 모바일 우선인 웹프로젝트 개발을 위한 가장 인기있는 HTML, CSS, JS 프레임워크입니다."라고 소개되어 있습니다.

아무튼 2011년 8월에 처음 발표된 프론트 엔드 웹 프레임워크입니다. 요즘 이것만 있으면 홈페이지 쉽게 만들 수 있어요..

2. 사이트

http://bootstrapk.com/

3. 다운로드

http://bootstrapk.com/getting-started/#download

zip 파일 형태로 다운 받을 수 있고 오늘 기준으로 다운 받으면 bootstrap-3.3.2-dist.zip이 받아집니다. 이 파일은 css, fonts, js 디렉토리로 풀립니다.

4. 샘플

* 부트스트랩 홈페이지에서 제공하는 샘플입니다.

<!DOCTYPE html>
<html lang="ko">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 위 3개의 메타 태그는 *반드시* head 태그의 처음에 와야합니다; 어떤 다른 콘텐츠들은 반드시 이 태그들 *다음에* 와야 합니다 -->
    <title>부트스트랩 101 템플릿</title>

    <!-- 부트스트랩 -->
    <link href="/css/bootstrap.min.css" rel="stylesheet">

    <!-- IE8 에서 HTML5 요소와 미디어 쿼리를 위한 HTML5 shim 와 Respond.js -->
    <!-- WARNING: Respond.js 는 당신이 file:// 을 통해 페이지를 볼 때는 동작하지 않습니다. -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>
  <body>
    <h1>Hello, world!</h1>

    <!-- jQuery (부트스트랩의 자바스크립트 플러그인을 위해 필요합니다) -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
    <!-- 모든 컴파일된 플러그인을 포함합니다 (아래), 원하지 않는다면 필요한 각각의 파일을 포함하세요 -->
    <script src="/js/bootstrap.min.js"></script>
  </body>
</html>

댓글 0

로그인 후 댓글을 남길 수 있습니다.

아직 댓글이 없습니다.