如何在html/css中用圖像替換文字

Question

我想用圖像替換文字，但我也希望網頁上的文字與圖像相關。這是因爲我希望搜索機器根據網頁上的文字列出頂部的網頁。

非常感謝。任何圖片

Answer 1

我想您所描述的「滑門「技術。

HTML：

<div class="myImg">This is the text</div> 

CSS：

.myImg { 
    background:url(myImg.gif) 0 0 no-repeat; 
    display:block; 
    height:200px; /* your image height */ 
    text-indent:-99999em; 
    width:200px; /* your image width */ 
    overflow:hidden; 
} 

Answer 2

alt標籤

像這樣： -

img src="image.jpg" alt=This is an image" 

在你的形象標籤

...

- 西蒙

Answer 3

你的問題不清楚的是什麼，你真正想要的。但這是我認爲你在尋找的東西。

<img src="img/SMS.jpg" width="200" height="150" alt="free SMS services" title="a page about SMS services" /> 

正如你可以看到標題會顯示爲鼠標懸停在圖片（也與屏幕閱讀器幫助）和ALT將搜索引擎優化的目的有所回升。然後在你的頁面上，你會看到與圖片相對應的文字。