你想要的弹出窗

弹出框是大家做前端总会需要的，例如没事就开始弹出是否确认删除啥的！~
没事就是开始弹出是否确认啥的！~

注意我们的bootstrap是有的

有的！

~~这四个破玩意总会需要————总用他们四个（就像东北F4：赵四/刘能/小沈阳/谢广坤）~~

bootstrap.min.css
jquery.min.js
popper.min.js
bootstrap.min.js

做web页面的小伙伴一定和我一样总会需要JQuery和Bootstrap的导入和使用
做习惯了就会习惯了~

在这里插入图片描述

就像这个不带背景的弹出窗

链接: 链接占时没有，多说一句IT行业马爸爸是我偶像

图片:
在这里插入图片描述

这样，我工作的动力就打打代码

看一下代码可以粘贴的吧

<head>
	<title>Bootstrap_弹出窗</title>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<link rel="stylesheet" href="css/bootstrap.min.css">
	<script src="js/jquery.min.js"></script>
	<script src="js/popper.min.js"></script>
	<script src="js/bootstrap.min.js"></script>
</head>

<body>

	<div class="container">
		<div style="text-align: center;">
			<button type="button" class="btn btn-success" data-toggle="modal" data-target="#demo">
                                             点击我出现弹出框
                            </button>
		</div>
		<div class="modal fade" id="demo">
			<div class="modal-dialog">
				<div class="modal-content" style="margin-top: 50%;">
					<div class="modal-header">
						<h5>您确定删除吗?</h5>
					</div>
					<div class="modal-body">
						XXXXXXXXXXXXXXXXXX
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-secondary" data-dismiss="modal">确定</button>
						<button type="button" class="btn btn-secondary" data-dismiss="modal">取消</button>
					</div>
				</div>
			</div>
		</div>
	</div>
</body>

尝试一下就好使了，bootstrap上有

四个文件http地址吧，如果粘贴太多了（jquery肯定都有就发一个popper.min.js吧）：

     https://cdn.staticfile.org/popper.js/1.12.5/umd/popper.min.js
     其它三个就是（你们都有）
        bootstrap.min.css
        jquery.min.js
        bootstrap.min.js
     你们都有然后主要的是bootstrap.min.css 有个样式自己需要修改掉
     
		 .modal-backdrop {
		  position: fixed;
		  top: 0;
		  right: 0;
		  bottom: 0;
		  left: 0;
		  z-index: 1040;
		  background-color: #000;
		}
		
        删除掉
	    这样背景黑色就木有啦!
	   
## ありがとう 谢谢大家

就像这个不带背景的弹出窗

看一下代码可以粘贴的吧

四个文件http地址吧，如果粘贴太多了（jquery肯定都有就发一个popper.min.js吧）：

猜你喜欢