web组件目录页

最新推荐文章于 2022-05-18 19:58:35 发布

白煮酒

最新推荐文章于 2022-05-18 19:58:35 发布

阅读量229

点赞数

文章标签： web

本文链接：https://blog.csdn.net/ParisT_T/article/details/90449580

版权

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8"> 
	<link rel="stylesheet" href="public/content/css/font-awesome/css/font-awesome.css">
	<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
	<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
	<script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>

	<style>
	body{
		margin: 0px;
    	padding: 0px;
	}
	.zhezhao{
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		background: rgba(0,0,0,1);
		width:100%;
		height: 100%;
		text-align: center;	
		font-family: "微软雅黑";
	}
    .table_box {
    	position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
    	width:80%;
    	height: 600px;
    	background-color: white;
		margin:auto;
    	padding: 0px!important;
    }
    .table_head{
    	width: 100%;
    	height:50px;
    	margin: 0px!important;
    	padding: 0px!important;
    	border-bottom: 1px solid #7AAD6D;
    	line-height: 50px;
    	font-size: 18px;
    	letter-spacing: 2px;
    	color: #30462A;
    }
   
    .table_menu{
    	position: absolute;
    	left: 0px;
    	width: 15%;
    	height: 550px;
    	background-color:white;
    	padding: 10px;
    	border-right: 1px solid #7AAD6D;
    	text-align: left;
    }
    .panel{
    	border: none;
    	box-shadow: none;
    	/*background-color: #C1DCC1;*/
    	border-radius: 2px!important;
    } 
    .panel-heading{
    	padding:3px;
    	margin: 0px;
    	text-decoration: none;
    }  
    
    .panel-heading a,.panel-heading a:hover,.panel-heading a:active{
    	text-decoration: none;
    }
    .panel-body{
    	text-align: left;
    	padding:0px!important;
    	margin: 0px!important;
    }
    .panel-body ul{
    	list-style:none;
    	padding-left:20px;
    	margin: 0px;
    } 
    .panel-body ul>li{
    }
    
    </style>




</head>
<body>
<div id="" class="zhezhao">
	

	<div class="table_box container">
		<div class="table_head row">
			xxxxxxxxx
		</div>
		<div class="row">
		    <!--左侧-->
		    <div class="table_menu col-md-2">
				<div class="panel">
					<div class="panel-heading">
						<h4 class="panel-title">
							<a data-toggle="collapse" data-parent="#accordion" 
							   href="#menu_1">
								<i class="fa fa-folder-o"></i>&nbsp;文件夹
							</a>
						</h4>
					</div>
					<div id="menu_1" class="panel-collapse collapse">
						<div class="panel-body">
							<ul>
								<li><i class="fa fa-file-o"></i>&nbsp;&nbsp;1.文件1</li>
								<li><i class="fa fa-file-o"></i>&nbsp;&nbsp;2.文件2</li>
							</ul>
						</div>
					</div>
				</div>	
		    </div>
		    
		    <!--右侧-->
		    <div class="col-md-10">
		    
		    </div>
		
		    
		</div>
	</div>
</div>	











	


</body>

白煮酒

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
web组件目录页

<!DOCTYPE html><html><head> <meta charset="utf-8"> <link rel="stylesheet" href="public/content/css/font-awesome/css/font-awesome.css"> <link rel="stylesheet" hre...
复制链接

扫一扫