<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
div{
width:500px;
height:500px;
border:3px solid red;
background-color:blue;
background-image:url(../img/images/5.JPG);
/*1.在水平/竖直线排列图片 repeat-x/y*/
background-repeat: repeat-x;
/*2.no-repeat是指出现一个图片,无no-repeat则出全部背景*/
/*background-repeat:no-repeat;*/
/*+++++++++++++++++++++++下方都是一个图片进行修改*/
/*size两个值大小一样可以写一个或两个*/
/*background-size: 200px 200px;*/
/*background-size: 200px;*/
/*background-size: 50% 40%;*/
/*按最大的排满,可能留有空白*/
/*background-size:contain;*/
/*把背景图片单一放大到整个方格中,不留空白*/
/*background-size: cover;*/
/*把图片进行移动,第一个数宽变化,第二个数是高变化。正数向右边,负数向左边*/
/*background-position: 200px 20px;*/
}
</style>
</head>
<body>
<div>123123</div>
</body>
</html>
阴影图片的变化
最新推荐文章于 2022-02-28 11:02:32 发布