<style>
div{
width: 500px;
height: 500px;
border: 1px solid red;
background: url(images/dog.jpg) no-repeat;
/* background-size: 宽度 高度; */
/* background-size: 500px 200px; */
/* 500px 500px;完全铺满盒子 */
/* background-size: 500px 500px; */
/* 只设置一个参数为等比缩放 */
/* background-size: 500px; */
/* 里面的单位可以是% 相对于父盒子来说的 */
/* background-size: 100%; */
/* cover完全覆盖盒子 会导致显示不全
等比例放大 使图片完全覆盖盒子 等价于size: 100%*/
/* background-size: cover; */
/* contain等比拉伸 当宽度或高度 铺满div盒子就不再拉伸了
可能会出现空白区域*/
/* background-size: contain; */
}
</style>
</head>
<body>
<div></div>
</body>
运行结果: