共计 431 个字符，预计需要花费 2 分钟才能阅读完成。
HTML 如何在图片上添加文字
当我们开发一个页面，插入图片时，需要有一组文字对图片进行描述。那么 HTML 中如何在图片上添加文字 呢？这篇文章告诉你。
先让我们来看下效果图：
句子“这是一张夜空图片”被放置在了图片的左下角。
那么这个是如何设置的呢。
首先我们要设计一个 div，将图片的和文字放置在 div 里面，设置文字的样式。随后需要用到“定位”，将 div 设置为父级，为相对定位，position：relative；将 h1 设置为绝对定位，position：absolute。在调整合适的位置即可。源代码如下：
W3Cschool
![]()
这是一张夜空的图片
图片素材：
以上就是 HTML 中如何在图片上添加文字 问题的全部解答。同学们可以自行保存素材进行练习巩固。
原文地址: HTML 如何在图片上添加文字
正文完
