bootstrap面板

最新推荐文章于 2023-07-22 10:43:08 发布

taojYang

最新推荐文章于 2023-07-22 10:43:08 发布

阅读量116

点赞数

CC 4.0 BY-SA版权

分类专栏： bootstrap 文章标签： bootstrap

本文链接：https://blog.youkuaiyun.com/weixin_43293451/article/details/92645906

bootstrap 专栏收录该内容

26 篇文章

订阅专栏

由于博客内容为空，暂无法提供包含关键信息的摘要。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>bootstrap</title>
	<style type="text/css">		
		div.col-xs-3{
			text-align: center;
		}
	</style>
</head>
<body>
	<script src="jquery.min.js"></script>
	<link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap/3.3.6/bootstrap.min.css">
	<script src="bootstrap/js/bootstrap/3.3.6/bootstrap.min.js"></script>
	<div style="width:800px;margin:20px">
		<div class="panel panel-default">
			<div class="panel-heading">面板标题</div>
			<div class="panel-body">
				面板内容
			</div>
			<div class="panel-footer">面板脚注</div>
		</div>
		<div class="panel panel-default panel-success">
			<div class="panel-heading">面板标题</div>
			<div class="panel-body">
				面板内容
			</div>
			<div class="panel-footer">面板脚注</div>
		</div>
		<div class="panel panel-default panel-danger">
			<div class="panel-heading">面板标题</div>
			<div class="panel-body">
				面板内容
			</div>
			<div class="panel-footer">面板脚注</div>
		</div>
	</div>
</body>
</html>

在这里插入图片描述