- Bootstrap 시작하기
- 부트스트랩 튜토리얼
- 부트스트랩 스타터 템플릿
1 소스 코드
html
Copy
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>부트스트랩 스타터 템플릿</title>
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet">
<style>
* { font-family: NanumGothic, 'Malgun Gothic'; }
body { padding-top: 50px; }
.starter-template {
padding: 40px 15px;
text-align: center;
}
</style>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">프로젝트 이름</a>
</div>
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="#">홈</a></li>
<li><a href="#about">소개</a></li>
<li><a href="#contact">연락</a></li>
</ul>
</div>
</div>
</div>
<div class="container">
<div class="starter-template">
<h1>부트스트랩 스타터 템플릿</h1>
<p class="lead">새 프로젝트를 빠르게 시작하려면 이 문서를 활용해보세요.<br> HTML 문서 뼈대가 갖추어져 있습니다.</p>
</div>
</div>
</body>
</html>
2 같이 보기
3 참고 자료
편집자 Jmnote Jmnote bot John Jeong
로그인하시면 댓글을 쓸 수 있습니다.