首頁猿問 html+css怎么在圖片上添加文字

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

Html5

幕布斯6054654 2019-05-31 03:02:33

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

查看完整描述

2 回答

四季花海

TA貢獻(xiàn)1811條經(jīng)驗(yàn) 獲得超5個(gè)贊

html+css在圖片上添加文字有兩種方法如下：

1.添加一個(gè)DIV，采用絕對(duì)定位，圖片所屬DIV為基準(zhǔn)

<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>

背景圖片現(xiàn)在有了，然后在上面寫上你需要寫的字就可以了。

1 反對(duì) 回復(fù) 2019-06-01

偶然的你

TA貢獻(xiàn)1841條經(jīng)驗(yàn) 獲得超3個(gè)贊

第一種方法：
添加一個(gè)DIV，采用絕對(duì)定位，圖片所屬DIV為基準(zhǔn)
<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>