css怎么加文字(css 添加文字)

html+css如何在图片上添加文字

可以。

以html为例，步骤：

一、在body中建立文字信息以及图片内容，也就是在header中包含两个同级，图片和文字。

二、在CSS中对文字图片进行简单样式添加，效果如图所示；大盒子使用描边显示，里面包含了图片和下面的文字。

三、想要将文字弄到画面上去，这时候需要对header添加相对定位，对文字标签p添加绝对定位。

四、对文字添加了绝对定位后，如图效果，然后就需要对其设置下位置关系了。

五、位置关系通常就是top ?bottom left right 上下左右四个方向了，最后完成了。

css怎么在图片上添加文字

文字在图片上显示

!DOCTYPE html

html

head

title/title

meta charset="UTF-8"

style

#abox{

position:relative;/*容器相对定位*/

width:300px;/*宽度300px*/

margin:0 auto;/*横向居中*/

}

#abox img{

width:300px;/*宽度300px*/

}

span{

position:absolute;/*文字容器绝对定位*/

display:block;/*span转为块元素*/

width:100%;/*宽度相对于父容器100%*/

text-align:center;/*文字居中*/

top:0;/*距离父容器顶部0*/

left:0;/*距离父容器左侧0*/

color:red;/*文字颜色红色*/

font-size:18px;/*文字大小既文字高度18px*/

font-weight:bold;/*文字加粗*/

}

/style

/head

body

div id="abox"!--容器，相对定位--

? img src="123.jpg"!--图片--

? span我要显示文字/span!--文字，绝对定位--

/div

/body

/html

html+css怎么在图片上添加文字

html+css在图片上添加文字有两种方法如下：

1.添加一个DIV，采用绝对定位，图片所属DIV为基准

div style="position:relative;width:100px;height:100px;"

img src="" alt="" /

div style="position:absolute;width:100px;height:100px;z-indent:2;left:0;top:0;"

文字

/div

/div

第二种方法:图片作为背景图片

div style="background:url(abc.jpg) no-repeat left top;"

wenzi

/div

背景图片现在有了，然后在上面写上你需要写的字就可以了。