DIV 布局之左右布局左侧固定右侧自动适应
2019-10-27 本文已影响0人
出来混要还的
效果
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Cache-Control" content="no-cache" />
<meta http-equiv="Expires" content="0" />
<title>左边固定，右边自适应</title>
<style type="text/css">
html,body {height: 100%;padding: 0; margin: 0; }
.parent{
width:600px;
height: 450px;
margin:100px auto;
position: relative;
background-color: red;
}
.left{
background-color: #BBE8F2;
width: 100px;
height: 100%;
position: absolute;
}
.right{
margin-left: 100px;
background-color: #E6E9F0;
height: 100%;
}
</style>
</head>
<div class="parent">
<div class="left">
left
</div>
<div class="right">
right
</div>
</div>
</html>
