본문 바로가기
[Front-End] 프론트엔드/[bootstrap] 부트스트랩

html bootstrap popover 부트스트랩 팝오버 소스 코드

by codeomni 2018. 8. 12.
반응형

 

안녕하세요.

 

부트스트랩에는 웹 페이지를 쉽게 구현할 수 있는다양한 기능들이 있습니다.

기능들은 사용자에게 편의를 주고 시각적인효과를 줍니다.

팝 오버는 웹 페이지에 메모처럼 추가적인 내용을효과적으로 표현합니다.

 

 

 

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
<!--
Copyright (c) 2011-2018 Twitter, Inc.
Copyright (c) 2011-2018 The Bootstrap Authors
-->
 
<!DOCTYPE html>
<html>
    <head>
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>codeomni.tistory.com bootstrap popover 부트스트랩 팝오버 소스 코드</title>
        <link href="css/bootstrap.min.css" rel="stylesheet">
        <style>
            body {
                padding: 100px 100px;
            }
        </style>
    </head>
    <body>    
        <div>
            <button id="pop" class="btn btn-warning" data-original-title="title" data-toggle="Popover" data-content="codeomni.tistory.com bootstrap popover 부트스트랩 팝오버 소스 코드" data-placement="bottom">Popover button</button>
        </div>
        <script src="js/jquery-2.1.3.min.js"></script>
        <script src="js/bootstrap.min.js"></script>
        <script>
            $("#pop").popover();
        </script>
    </body>
</html>
cs
 

 

 

▲ 실행 화면입니다.

 

 

참고 문헌

Popovers . (Aug 12 2018). http://bootstrapk.com/javascript/. 

 

자바스크립트 · 부트스트랩

Raw denim you probably haven't heard of them jean shorts Austin. Nesciunt tofu stumptown aliqua, retro synth master cleanse. Mustache cliche tempor, williamsburg carles vegan helvetica. Reprehenderit butcher retro keffiyeh dreamcatcher synth. Cosby sweater

bootstrapk.com

 

댓글