1、1首先，打開html編輯器，新建html文件，例如indexhtml2在indexhtml中的ltbody標簽中，輸入html代碼ltimg src=quotsmall3pngquot ltspanhello imageltspan3瀏覽器運行indexhtml頁面，此時成功在圖片右邊寫。

2、Calt屬性例如ltimg src=quotxxxjpgquot alt=quot這是一個圖片“ width=quot100quot height=quot50quot意思是這個圖片寬100像素，高50像素，當你把鼠標移動到圖片上時會顯示quot這時一個圖片“。

3、ltstyleltheadltbodyltimg src=quotpicjpgquotltspan我是文字ltspanltbodylthtml 二在開發(fā)工具里面的截圖三瀏覽器里面的效果截圖四總結一下這個是在body里面添加一下背景圖片，然后再建div就可以布。

4、以html為例，步驟一在body中建立文字信息以及圖片內容，也就是在header中包含兩個同級，圖片和文字二在CSS中對文字圖片進行簡單樣式添加，效果如圖所示大盒子使用描邊顯示，里面包含了圖片和下面的文字三想要將。

5、為圖片要添加簡要的說明文字的屬性是title當圖片無法正常加載時顯示的文字，利于seo的作用alt當鼠標放上圖片鏈接時顯示的文字，注釋圖片鏈接，提高用戶體驗titleTITLE 元素僅可在 HEAD 元素內使用位于 TITLE 開閉。

6、ltp這里是文字說明ltp ltbody lthtml 在上面的示例代碼中，使用了Flex布局display flex來將三張圖片放在一行，并通過設置每個圖片占據(jù)一行的三分之一寬度width 3333%來實現(xiàn)圖片和文字的樣式可以根據(jù)。

7、標簽里面加alt屬性，格式ltimg src=quot圖片路徑quot alt=quot描述圖片文字quot。

8、然后一個盒子裝著頭像和文字，把裝著頭像和文字 的盒子根據(jù)裝著圖片的盒子進行定位就可以了，像這樣的其實很簡單的，要多思考和分析 代碼，要注意圖片你要自己放圖片，和修改圖片路徑 lt！DOCTYPE html lthtml lthead lt。

9、3點擊插入的圖標，屬性面板左下角點擊熱點工具，這里選擇矩形熱點工具4在圖像上拖動得到熱點區(qū)域5點擊底部map#map標簽，點擊代碼6在map標簽加入title屬性，其屬性值為說明文字7按ctrl+s保存文件，按F12調試。

10、如何在圖片上加文字 如何在圖片上加入文字方法如下 1把需要添加字的圖片先移到桌面，鼠標右鍵點擊圖片，看到“編輯”后打開編輯2然后在“畫圖”中編輯，點擊框中“A”的標志，這種標志一般都是編輯字體 3。

11、新建html文件，例如indexhtml2在indexhtml中的ltbody標簽中，輸入html代碼ltimg src=quotsmall3pngquot ltspanhello imageltspan3瀏覽器運行indexhtml頁面，此時成功在圖片右邊寫了文字“hello image”。

12、單純的html要實現(xiàn)你說的效果很難，必須html和css配合才可以，首先用css為需要設置背景的元素設置背景，然后用html寫文字等內容附加一個簡單例子，希望幫到你其中1jpg跟這個頁面在一個路徑lt！doctype htmllthtml。

13、2添加CSS樣式修飾，最外面的大框添加寬度居中3現(xiàn)在的圖文是這樣排版4想要將圖文左右排版，無非是定位或者浮動，對圖片塊和文字塊都添加了浮動效果后5如圖添加浮動后，文字部分因為文字太長超出了他所用那的。

14、圖片添加連接我的方法是在ltimg標簽兩邊添加lta標簽 如lta href=quot要連接的地址quot title=quot這里也可以使用title屬性，也是懸停會會顯示文字quot ltimg src=quot圖片地址quot width=quot170quot height=quot89quot alt=quotquot title=“這里寫。

15、```html ltdiv style=quotbackgroundimage url#39yourimageurl#39 backgroundsize contain width 100%quot ltpYour text hereltp ltdiv ```在這個示例中，我們使用`div`元素作為背景容器，將圖片作為背景。