| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 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 |
- 하루한마디영어
- 안드로이드
- 구글안드로이드
- 구글 안드로이드 개발
- 안드로이드폰
- objective-c
- sky 시리우스폰
- Form Stuff
- 구글 안드로이드
- 안드로이드 개발 강좌
- 안드로이드개발
- 안드로이드 2.0 개발
- 인기있는 블로그 만들기
- 안드로이드2.0개발
- 아이폰 바탕화면
- 안드로이드 바탕화면
- SKY 시리우스
- 아이폰 배경화면
- 스카이 안드로이드폰 시리우스 K양 동영상
- 스마트폰 배경화면
- android
- 안드로이드 개발 2.0 강좌
- 안드로이드 개발 2.0
- 안드로이드 개발
- 하루 한마디 영어
- MapView
- 안드로이드2.0
- 스카이 안드로이드폰 시리우스
- 안드로이드 배경화면
- 영어
- Today
- Total
moozi
7/21 bootstrap02.html 본문
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>Bootstrap연습</title>
<!-- 뷰포트 ------------------------------------------->
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Bootstrap연습</title>
<!-- 부트스트랩CSS -->
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<!-- jQuery -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<!-- 부트스트랩 JavaScript -->
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<style>
.container{margin-top: 80px !important;}
</style>
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">TIS정보기술교육센터</a>
</div>
<div class="collapse navbar-collapse" id="myNavbar">
<ul class="nav navbar-nav">
<li class="active"><a href="#">교육원소개</a></li>
<li><a href="#">교육원연혁</a></li>
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">과정소개 <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">구직자과정</a></li>
<li><a href="#">재직자과정</a></li>
</ul>
</li>
<li><a href="#">Contact</a></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a href="#"><span class="glyphicon glyphicon-user"></span> Sign Up</a></li>
<li><a href="#"><span class="glyphicon glyphicon-log-in"></span> Login</a></li>
</ul>
</div>
</div>
</nav>
<div class="container">
<div class="row">
<div class="col-md-3">
<div class="panel panel-primary">
<div class="panel-heading">
<h3 class="panel-title">
<span class="glyphicon glyphicon-leaf"></span>
구직자과정</h3>
</div>
<ul class="list-group">
<li class="list-group-item">웹표준UI/UX</li>
<li class="list-group-item">Java</li>
<li class="list-group-item">안드로이드</li>
</ul>
</div>
<div class="panel panel-success">
<div class="panel-heading">
<h3 class="panel-title">
<span class="glyphicon glyphicon-send"></span>
재직자과정</h3>
</div>
<ul class="list-group">
<li class="list-group-item">웹퍼블리셔</li>
<li class="list-group-item">프론트엔드개발자</li>
<li class="list-group-item">리눅스서버</li>
</ul>
</div>
<div class="panel panel-info">
<div class="panel-heading">
<h3 class="panel-title">
<span class="glyphicon glyphicon-phone-alt"></span>
Contact</h3>
</div>
<ul class="list-group">
<li class="list-group-item">Board</li>
<li class="list-group-item">Email</li>
<li class="list-group-item">SNS</li>
</ul>
</div>
</div>
<div class="col-md-9">
<div class="jumbotron">
<h1>TIS정보기술교육센터</h1>
<p>정부지원IT전문과정 운영중.</p>
</div>
<p>
<img src="img/title.png" class="img-thumbnail" width="70%" style="float:left;margin-right:10px;">
TIS정보기술교육센터에서는 ......
TIS정보기술교육센터에서는 ......
TIS정보기술교육센터에서는 ......
TIS정보기술교육센터에서는 ......
TIS정보기술교육센터에서는 ......
TIS정보기술교육센터에서는 ......
</p>
</div>
</div>
</div>
</body>
</html>
'TIS_2016 > HTML5_3기' 카테고리의 다른 글
| 7/21 bootstrap03.html (0) | 2016.07.21 |
|---|---|
| Bootstrap연습문제01 (0) | 2016.07.21 |
| html연습문제1~5 풀이 (0) | 2016.07.21 |
| 박스 수직 가운데 정렬 하기 (0) | 2016.07.20 |
| 7/20 수업 예제 파일 (0) | 2016.07.20 |