html 怎么在背景图片上添加内容,css 如何在一个背景图片的中间添加文字呢？

摘要：

下文讲述使用css代码在背景图片的中间添加文字的方法分享，如下所示；

实现思路:

1.定义一个div，并放入背景图片，设置其内部元素水平垂直居中

2.定义一个子div,并放入文字信息

通过以上两个步骤，即可实现背景图片中间放入相应的文字

例:

maomao365.com

背景图片中间加入文字的示例

.main {

width:500px;

height:100px;

line-height:100px;

text-align: center;

background: url(http://www.maomao365.com/wp-content/uploads/2020/01/css_bg.png) no-repeat;

background-size: 100% 100%;

}

.main-text {

color: white;

font-size: 18px;

font-weight: bold;

}

居中文字(maomao)

css背景图片中文字居中的示例分享