＆＃13;
body {
width: 100%;
height: 100%;
margin: 0px;
padding: 0px;
}
header {
background-color: red;
height: 70px;
}
main {
background-color: green;
height: 30%;
}
footer {
background-color: blue;
}
#left_image {
background-image: (left.jpg);
height: 100%;
/* auto width for proper image scaling */
}
#right_image {
background-image: (right.jpg);
width: 50%;
/* auto height for proper image scaling */
}
#content {
width: 100%;
margin: 3em 1em;
z-index: 1;
}
＆＃13;
<body>
<header></header>
<main>
<div id="left_image"></div>
<div id="right_image"></div>
<div id="content">This content is in front of the background-images</div>
</main>
<footer></footer>
</body>
＆＃13;