일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
- 안드로이드 배경화면
- 구글 안드로이드 개발
- 안드로이드폰
- 구글 안드로이드
- 안드로이드개발
- 안드로이드 바탕화면
- 안드로이드 개발 2.0 강좌
- 하루한마디영어
- 구글안드로이드
- 스마트폰 배경화면
- 안드로이드 개발 강좌
- 안드로이드
- SKY 시리우스
- 아이폰 바탕화면
- 스카이 안드로이드폰 시리우스
- 안드로이드2.0
- 스카이 안드로이드폰 시리우스 K양 동영상
- 인기있는 블로그 만들기
- objective-c
- 안드로이드2.0개발
- 안드로이드 개발
- 안드로이드 개발 2.0
- 안드로이드 2.0 개발
- Form Stuff
- MapView
- sky 시리우스폰
- 영어
- android
- 하루 한마디 영어
- 아이폰 배경화면
- Today
- Total
moozi
bootstrap04.html 본문
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</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>
</head>
<body>
<div id="myCarousel" class="carousel slide" data-ride="carousel">
<!-- Indicators -->
<ol class="carousel-indicators">
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
<li data-target="#myCarousel" data-slide-to="2"></li>
<li data-target="#myCarousel" data-slide-to="3"></li>
</ol>
<!-- Wrapper for slides -->
<div class="carousel-inner" role="listbox">
<div class="item active">
<img src="img/title1.png" alt="안랩">
<!--
<div class="carousel-caption">
<h3>New York</h3>
<p>The atmosphere in New York is lorem ipsum.</p>
</div>
-->
</div>
<div class="item">
<img src="img/title2.png" alt="안랩">
</div>
<div class="item">
<img src="img/title3.png" alt="안랩">
</div>
<div class="item">
<img src="img/title4.png" alt="안랩">
</div>
</div>
<!-- Left and right controls -->
<a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">
<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
<div class="container-fluid">
<div class="row">
<div class="col-md-4">
<h3>보안경보</h3>
<p>
<img src="img/icon1.png" alt="보안경보">
</p>
</div>
<div class="col-md-4">
<ul class="nav nav-tabs">
<li class="active"><a data-toggle="tab" href="#notice">Notice</a></li>
<li><a data-toggle="tab" href="#press">Press</a></li>
</ul>
<div class="tab-content">
<div id="notice" class="tab-pane fade in active">
<p>[공지] V3 MSS ‘IT자산관리’ 업그레이..2016.07.15</p>
<p>[공지] 안랩 웹 보안 업그레이드 캠페인2016.07.14</p>
<p>[공지] V3 제품군, ASTx 엔진 패치(ASD 2...2016.07.13</p>
</div>
<div id="press" class="tab-pane fade">
<p>
안랩, 역사학자 신병주 교수 초청 인문학 특강 진행2016.06.24
</p>
<p>
안랩, '이메일 랜섬웨어 보안 서비스' 출시2016.06.24
</p>
<p>
안랩 V3 모바일 시큐리티, ‘URL/문자메..2016.06.24
</p>
</div>
</div>
</div>
<div class="col-md-4">
</div>
</div>
</div>
</body>
</html>
'TIS_2016 > HTML5_3기' 카테고리의 다른 글
bootstrap04.html (0) | 2016.07.25 |
---|---|
bootstrap연습문제02 (0) | 2016.07.22 |
bootstrap03.html (0) | 2016.07.22 |
bootstrap연습문제01 풀이 (0) | 2016.07.22 |
7/21 bootstrap03.html (0) | 2016.07.21 |