一、CSS3、圣杯布局
*{margin: 0;padding: 0;}
html{height: 100%;}
body{
height: 100%;
display: flex;
flex-direction: column;
}
header{
height: 150px;
background: orange;
}
section{
background: yellow;
flex: 1;
display: flex;
}
section article{
width: 250px;
background: red;
}
section div{
background: green;
flex: 1;
}
section aside{
width: 250px;
background: blue;
}
footer{
height: 150px;
background: pink;
}
<body>
<header></header>
<section>
<article></article>
<div></div>
<aside></aside>
</section>
<footer></footer>
</body>