怎样在css样式的盒子里添加图片啊？就比如是这样的

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

body{

background: url("image.png") no-repeat

height:100%

width:100%

overflow: hidden

background-size:cover或者background-size:100%

}

扩展资料:

CSS不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。 CSS 能够对网页中元素位置的排版进行像素级精确控制，支持几乎所有的字体字号样式，拥有对网页对象和模型样式编辑的能力。

编程工具

记事本：使用Windows系统自带的记事本可以编辑网页。只需要在保存文档时，以.html为后缀名进行保存即可。

Dreamweaver：它与Flash、Fireworks并称网页三剑客。Dreamweaver是集网页制作和管理网站于一身的所见即所得网页编辑器，它是第一套针对专业网页设计师特别开发的视觉化网页开发工具，利用它可以轻而易举地制作出充满动感的网页。

参考资料来源：百度百科:CSS

根据你的描述设置Body背景图片无效为路径问题。

解决办法：

修改路径：

background-image:url(../images/image2.jpg) //或者可以使用代码，其中可以添加宽度、高度、平铺、拉伸等： background:url(../images/image2.jpg)

css.css相对于images中image2.jpg在上一个目录中。前面为../imges/image2.jpg。

background:url与background-image:url区别在于，前者的属性范畴更大，附属参数和值是想效果更多。后者只正对于背景图。

注意事项：

A、相对路径与绝对路径在实际使用中各有优劣。

B、相对路径在使用时必须注意目录结构。

C、编程中所有代码间均为英文状态下的标点符号。

D、在使用时background:url()对浏览器的兼容性优于background-image:url()。

---