Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>多栏布局</title>
  <style media="screen">
  .wrap{
    display:flex;
  }
  .wrap div{
    height:100px;
  }
  .left{
    order:-1;
  }
  .main{
      flex-grow:1;
      background:red;
  }
  .left,.right{
    width:200px;
    background:green;
  }
  </style>
</head>
<body>
  <div class="wrap">
    <div class="main">我是主体(优先加载)</div>
    <div class="left">左边(固定宽度)</div>
    <div class="right">右边(固定宽度)</div>
  </div>
</body>
</html>
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers