在图片上叠加文字的简单方法

发布网友 发布时间：2022-03-09 02:54

我来回答

共2个回答

热心网友 时间：2022-03-09 04:23

可以把图片作为文字那个块标签的背景图片或者你把图片和文字都放在一个同一个div 里面然后给图片和文字加上定位，然后文字的图层比图片的图层位置高就行了

第一种
<style>
.div{width: 200px;height: 200px;background: url("图片路径") no-repeat;}
</style>

<div class="div">
<p>你的文字内容</p>
</div>

第二种
<style>
.div{width: 200px;height: 200px;position: relative;z-index: 0}
.div img{position: absolute;top: 0;left: 0;width: 100px;height: 100px;}
.div p{position: absolute;top: 0;left: 0;z-index: 10;}
</style>

<div class="div">
<img src="图片路径" alt="#">
<p>你的文字内容</p>
</div>

热心网友 时间：2022-03-09 05:41

1、进入”美图秀秀“，点击上方菜单栏上的”文字“

2、点击”打开一张图片“选择自己需要添加文字的图片

3、点击”输入文字“在文字编辑框中输入要添加的文字

4、这里可以设置文字的字体颜色加粗等等

5、将鼠标移动到箭头处，可以根据自己需要调节大小，旋转方向

在高级设置中可以设置文字的横、竖排

参考资料：http://jingyan.baidu.com/article/1974b2a888ccf4b1f7748c.html