CSSZ中如何使用一张比盒模型小的图片填满整个盒模型，且不重复。是在HTML中导入的，不做背景。

html-css036

CSSZ中如何使用一张比盒模型小的图片填满整个盒模型，且不重复。是在HTML中导入的，不做背景。,第1张

可以这样子写

<div class="box"><img src="../images/1.jpg" width="100%"></div>

<style>

.box{500pxmargin:0 auto}

.box img{display:block}

</style>

这里面的div就是你所说的盒模型，宽度的样式自己根据需要定义，图片的宽度一定要设置成100%，路径换成你自己的图片路径

1、打开HBuilder开发软件并在Web项目中创建一个新的静态页面。

2、将三个div元素插入body元素并将其类设置为AA，BB和CC。

3、预览静态页面，您可以看到页面效果，即中上层和下层。

4、分别设置AA，BB和CC三个类的样式属性，包括宽度，高度和背景颜色。

5、我们再次设置body元素样式属性。

body{

text-align: center

vertical-align: middle

display: box

display: -moz-box

display: -webkit-box

orient: horizontal

-moz-box-orient: horizontal

-webkit-box-orient: horizontal

}

6、分别添加字体的垂直分布。

text-align: center

vertical-align: middle