<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>背景</title>
<style type="text/css">
.bjDiv{
width: 300px;
height: 300px;
border: 1px blue solid;
/*背景颜色*/
/*background-color: red;
background-image: url(../AKL.jpg);*/
/*背景平铺
no-repeat 不平铺
repeat-x x轴平铺
repeat-y y轴平铺
repeat 默认值 两个方向都平铺*/
/*background-repeat: no-repeat;*/
/*背景大小
可以设置一个值 100px；
两个值 100px 200px
可以设置单词 contain*/
/*background-size: 100px;*/
/*背景位置
一个值 10px 代表X是10 Y居中
两个值 第一个值代表X，第二个值代表Y
也可以给代表位置的英文，
X left right center
Y top bottom center*/
/*background-position: right bottom;*/
/*复合写法*/
background: blue url(../AKL.jpg) no-repeat 50px 50px / 200px 200px;
</style>
</head>
<body>
<div class="bjDiv"></div>
</body>
</html>
网友评论