HTML圖片和文字是并列顯示的如下1 將文字浮在圖片上我們加個(gè)div把圖片和文字包在一起，并且加上imggroup和imgtip這兩個(gè)class，便于后面的處理我們要讓文字浮在圖片上面，需要加上定位看文字浮在了圖片的底部。

網(wǎng)站結(jié)構(gòu)是網(wǎng)站風(fēng)格統(tǒng)一的重要手段，包括網(wǎng)站布局文字排版導(dǎo)航圖片位置等等網(wǎng)站的統(tǒng)一性是網(wǎng)站營(yíng)銷(xiāo)的重要保障#xF9ED導(dǎo)航的統(tǒng)一具有企業(yè)特征的導(dǎo)航，會(huì)給人留下極其深刻的印象，比如融入標(biāo)志性的形態(tài)于其中，或者把導(dǎo)航設(shè)計(jì)在整個(gè)網(wǎng)站布局。

給左側(cè)的圖片加一個(gè)css樣式 verticalalign middle，如下圖代碼 如下圖。

圖片和文字的樣式可以根據(jù)需求進(jìn)行調(diào)整，例如圖片的間距padding文字的對(duì)齊方式textalign等你可以將示例代碼保存為一個(gè)HTML文件，將ltimg標(biāo)簽中的src屬性替換為你自己的圖片路徑，并在最后的ltp標(biāo)簽中添加自己的。

在此，馬海祥就用“注冊(cè)登陸找回密碼”這個(gè)在實(shí)際運(yùn)用中經(jīng)常遇到的情況還做實(shí)例，把“注冊(cè)”和“登陸”做成圖片，“找回密碼”設(shè)置成文字 html代碼如下 找回密碼 css代碼如下 #denglu *verticalalignmiddle *。

再在li標(biāo)簽下面添加一條橫線，并將背景圖片進(jìn)行定位，這樣我們可以看到很好的效果證實(shí)文字和圖片是在同一水平線上的想讓文字和圖片在同一水平線上，總結(jié)起來(lái)就是將圖片設(shè)為背景圖片，并添加paddingleft，然后定位一下圖片。