<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<style>
div{
height: 500px;
border: 2px solid darkmagenta;
/*背景颜色*/
background-color:springgreen;
/*背景图片*/
background-image: url("../ws1/img/office.jpg");
/*背景图片的展示方式*/
background-repeat: no-repeat;
/*背景图片的位置*/
background-position:center bottom;
/*背景图片的大小
contain:图片宽高等比例缩放,直到宽或高填满父布局,可能出现图片填充布局不完整
cover: 图片宽高等比例缩放,直到较小的宽或高填满父布局,可能出现图片溢出*/
background-size: cover;
}
</style>
<title>背景图片</title>
</head>
<body>
<div></div>
</body>
</html>