資料結構
網路
關係資料庫管理系統
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理
化學
生物
數學
英語
經濟學
心理學
社會科學
時尚研究
法學研究如何使用 Bootstrap 彈出外掛
彈出框類似於工具提示，提供了一個完整的帶有標題的擴充套件檢視。若要啟用彈出框，使用者只需將游標懸停在元素上即可。彈出框的內容可以使用 Bootstrap 資料 API 填充。
你可以嘗試執行以下程式碼來實現彈出外掛
示例
<!DOCTYPE html>
<html>
<head>
<title>Bootstrap Example</title>
<link href = "/bootstrap/css/bootstrap.min.css" rel = "stylesheet">
<script src = "/scripts/jquery.min.js"></script>
<script src = "/bootstrap/js/bootstrap.min.js"></script>
</head>
<body>
<div class = "container" style = "padding: 100px 50px 10px;" >
<button type = "button" class = "btn btn-default" title = "Popover title"
data-container = "body" data-toggle = "popover" data-placement = "left"
data-content = "Some content in Popover on left">
Popover on left
</button>
<button type = "button" class = "btn btn-primary" title = "Popover title"
data-container = "body" data-toggle = "popover" data-placement = "top"
data-content = "Some content in Popover on top">
Popover on top
</button>
<button type = "button" class = "btn btn-success" title = "Popover title"
data-container = "body" data-toggle = "popover" data-placement = "bottom"
data-content = "Some content in Popover on bottom">
Popover on bottom
</button>
<button type = "button" class = "btn btn-warning" title = "Popover title"
data-container = "body" data-toggle = "popover" data-placement = "right"
data-content = "Some content in Popover on right">
Popover on right
</button>
</div>
<script>
$(function (){
$("[data-toggle = 'popover']").popover();
});
</script>
</body>
</html>
更新於: 2020 年 6 月 12 日
146 次瀏覽
廣告