問(wèn)題出在position absolute 絕對(duì)定位了，就脫離原來(lái)的文檔流了除非你把這個(gè)去掉然后左浮動(dòng)float left也要去掉；比較簡(jiǎn)單的做法就是，將他們放置一個(gè)盒子內(nèi)，你想讓文字跟圖片居中，那么不一定要讓圖片當(dāng)文字的參照物，而是讓他們?cè)诖蠛凶觾?nèi)居中，不需要太復(fù)雜的框架結(jié)構(gòu)，只需要利用樣式的屬性即可，并且各個(gè)瀏覽器都會(huì)正常顯示，代碼如下；lttable lttrlt！這里是一行 lttd ltimg src=quotgifquot lttd lttr lttrlt！這里是下一行 lttd 這里的文字在下方 lttd lttr lttable 不懂html。

可以以html為例，步驟一在body中建立文字信息以及圖片內(nèi)容，也就是在header中包含兩個(gè)同級(jí)，圖片和文字二在CSS中對(duì)文字圖片進(jìn)行簡(jiǎn)單樣式添加，效果如圖所示大盒子使用描邊顯示，里面包含了圖片和下面的文字三；使用代碼的方法，在圖片上加字怎么做到呢 在html文件中，先建立一個(gè)div，然后在里面設(shè)置一個(gè)圖片和文字h1，如圖所示 現(xiàn)在打開(kāi)后的樣式是這樣的，如圖，圖片在上，文字在下 然后對(duì)h1進(jìn)行簡(jiǎn)單修飾，對(duì)文字大小fontsize和文字；1比如我在div里面書(shū)寫(xiě)了一些文字，然后想要在放入一張圖片，這時(shí)候小伙伴可能會(huì)直接想到img標(biāo)簽，其實(shí)這個(gè)想法是錯(cuò)誤的2首先，我們應(yīng)該先給div設(shè)置寬度和高度，保證文字有一個(gè)范圍3然后通過(guò)background給div添加一張。

ltdiv style=quottextalign centerquot ltimg src=quot圖片地址圖片名稱(chēng)jpgquot ltp你要輸入的文字ltpltdiv如果圖片和文字在同個(gè)div內(nèi)，那就把div的css設(shè)置為textalign center；圖片默認(rèn)為內(nèi)聯(lián)元素，可以設(shè)置圖片為塊級(jí)元素，然后直接寫(xiě)文字就可以在圖片下方了舉例img displayblock HTML代碼ltimg src=quot圖片路徑quot 這里是測(cè)試文字，可以在圖片下方；圖片下面加ltp標(biāo)簽即可，ltimg src=quot褲子jpgquotltaltpXXXltp；1首先，打開(kāi)html編輯器，新建html文件2其次在indexhtml中的標(biāo)簽，輸入代碼3最后瀏覽器運(yùn)行indexhtml頁(yè)面，此時(shí)文字成功浮動(dòng)到了圖片右上方了。

lthtml 這樣就會(huì)能夠?qū)⑽淖址旁趫D片的正下方，得到以下圖片文字位于正右邊的方法lt！DOCTYPE html lthtml lthead ltmeta charset=quotUTF8quot ltmeta name=quotviewportquot content=quotwidth=devicewidth， initialscal；新建html文件，例如indexhtml2在indexhtml中的ltbody標(biāo)簽中，輸入html代碼ltimg src=quotsmall3pngquot ltspanhello imageltspan3瀏覽器運(yùn)行indexhtml頁(yè)面，此時(shí)成功在圖片右邊寫(xiě)了文字“hello image”；代碼，要注意圖片你要自己放圖片，和修改圖片路徑 lt！DOCTYPE html lthtml lthead ltmeta charset=quotutf8quot lttitle圖片上放文字lttitle ltstyle type=quottextcssquot html，body margin0 autoimg display；1首先當(dāng)然是要插入一張圖片啦，代碼如下lta href=quot#quot target=quot_blankquotltimg src=quotimages13pngquot width=quot240quot heigth=quot240quotlta 圖片路徑自己定義2定義一個(gè)層在圖片上這里要用到定位positionltdiv。

lthtml 代碼修改成這樣就可以了，把幾個(gè)IMG分別裝到列表里面，然后定義一下這個(gè)列表的樣式即可 文字部分用了一下p標(biāo)簽，給內(nèi)容分一下行，代碼看起來(lái)會(huì)規(guī)范一些另外，img標(biāo)簽是不需要閉合的，我把ltimg給刪掉了。