定位圖像替代文字

Question

我有一個大表與大量的條目對應於同樣大量的圖像。要求是爲每個無法在服務器上找到的圖像顯示替代文本。 alt屬性的工作正常。

但是，我無法定位alt文本 - 適用於圖像的單元格填充，間距，邊距等似乎不適用於替代文本。

我們正在使用表格來進行頁面佈局，這可能是相關的。

有沒有人知道定位替代文字的方法？

Answer 1

img { 
    width: 100px; 
    height: 50px; 
    line-height: 50px; 
    text-align: center; 
} 

將垂直和水平對齊設置爲中間。

Answer 2

你不能。我知道沒有瀏覽器允許設置alt屬性的表示形式。

使用服務器端語言（例如PHP）編寫頁面而不是強制每個瀏覽器請求可能不存在的圖像看起來更加明智。這樣，您可以輸出<img>標籤或一個常規段落，具體取決於圖片是否存在。

您也可以編寫一個JavaScript函數（附加到<img>標記的錯誤事件），並用常規文本替換它。

Answer 3

您是否嘗試將填充或邊距應用於img本身而不是表格單元？您在IMG元素上使用的CSS也應用於圖像的替代文本。所以如果你設置一個

img { padding-left:30px; } 

你的ALT文本也被推到右邊30px（取決於文本對齊和其他東西）。 您可能還想定位：相對img或垂直 - 將其與鄰居單元格對齊（該關係很重要），或者只是類似於float類似但需要處理的東西，因爲它會將圖像拖出它的文本流失去了親子關係的佈局方面。 CSS樣式有一個不錯的resource。我不認爲你需要像JavaScript（jQuery）或類似的東西。

Answer 4

父元素的行高會影響替代文本的顯示。

Answer 5

如果你想要的形象被左上角對齊，但ALT文字居中這是不行的，但如果兩者的形象和替代文本應該對齊中心：

嘗試留出的height和width圖像中的屬性（如果你現在包含它們）。這應該只爲alt文本渲染一個邊界框，它可以垂直居中對齊，並且與文本對齊。取決於你希望你的佈局看起來像你可以擺弄它，直到alt文本和圖像看起來不錯。這是關於你能做到的最好，真的。