笔试的时候，倒在了布局上，实现圣杯布局
刚开始搞过，当时也是别人的方法，所以，对整个需求和实现都记的不清了。
现在总结一下，另外附上自己最简单的写法：
圣杯布局的目的
1.三栏展示
2.让中间的div优先加载，中间的div在dom中要提前
实现方式
我看了一下网上了，思路都很乱
我来个简单的吧
1.将calc进行到底
2.使用margin负值
代码如下
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div>
<div class="main">2222</div>
<div class="left">1111</div>
<div class="right">333</div>
</div>
<style>
/* 使用calc+margin负值 */
.main{
height: 800px;
float: left;
background: #000;
calc(100% - 200px);
margin-left: 100px;
}
.left{
height: 800px;
float: left;
background: red;
100px;
/* 在不考虑性能的情况下，在css中计算，这里将calc进行到底，感觉比网上的逻辑清晰很多 */
margin-left: calc(-100% + 100px);
}
.right{
height: 800px;
float: left;
background: green;
100px;
}
</style>
</body>
</html>