都按照要求做了啊为什么点击弹出不了？？-慕课网

都按照要求做了啊为什么点击弹出不了？？

来源：8-7 模态弹出框--触发模态弹出窗2种方法

AfterStories

2016-05-12 18:49

都按照要求做了啊为什么点击弹出不了？？

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>模态弹出窗的使用</title>
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
</head>
<body>
<!--下面是代码任务部分-->

<!-- href触发模态弹出窗元素 -->
<a class="btn btn-primary" data-toggle="modal" href="mymodal-link">通过链接href属性触发</a>
<!-- 模态弹出窗内容 -->
<div class="modal" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true" id="mymodal-link">
    <div class="modal-dialog">
    	<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
				<h4 class="modal-title">模态弹出窗标题</h4>
			</div>
			<div class="modal-body">
				<p>模态弹出窗主体内容</p>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
				<button type="button" class="btn btn-primary">保存</button>
			</div>
		</div>
	</div>
</div>

<!-- data-target触发模态弹出窗元素 -->
<button type="button" class="btn btn-primary" data-target="mymodal-data" data-toggle="modal">通过data-target触发</button>

<!-- 模态弹出窗内容 -->
<div class="modal fade" id="mymodal-data" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
				<h4 class="modal-title">模态弹出窗标题</h4>
			</div>
			<div class="modal-body">
				<p>模态弹出窗主体内容</p>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
				<button type="button" class="btn btn-primary">保存</button>
			</div>
		</div>
	</div>
</div>
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script> 
</body>
</html>

写回答关注

4回答

慕移动9181930

2022-03-24 00:43:29

可以把html中的css样式代码放入style.css文件中可以，也就是style.css是写css样式代码的。不错呀，功能很全呀

0 0
Bloody_daemon

2017-03-31 15:34:34

因为你都没加# ，href和data-target里的id都要加#

0 1
lgnan

2016-11-03 11:46:52

要加上css选择器里面的id #符号

0 0
wolf_KIKI

2016-05-13 09:32:14

href值和data-target值前面加#

0 0