jquery实现div边界同时满足左右上上下拖动的效果【就是一般后台管理系统...
发布网友
发布时间：2022-04-30 02:43
共1个回答
热心网友
时间：2022-04-22 19:03
这不需要用jquery，用css就可以满足。给你做了个例子。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
html,body,.box{
margin:0;
padding:0;
height:100%;
overflow:hidden;
font-size:14px;
color:#333333;
}
.box{
display:flex;
flex-direction: column;
box-sizing: border-box;
}
.top{
height:60px;
background:#999999;
color:#ffffff;
}
.left,.right{
width:200px;
background:#AAAAAA;
}
.center{
flex:1;
}
.content{
flex:1;
background:#fafafa;
display:flex;
flex-direction: row;
height:0;
}
.bottom{
height:40px;
background:#666666;
color:#ffffff;
}
.top,.bottom,.left,.right,.center{
align-items: center;
justify-content: center;
display:flex;
}
</style>
</head>
<body>
<div class="box">
<div class="top">top</div>
<div class="content">
<div class="left">left</div>
<div class="center">center</div>
<div class="right">right</div>
</div>
<div class="bottom">bottom</div>
</div>
</body>
</html>
