替代文字中的換行

在仍遵守XHTML 1.0嚴格標準的同時，我可以在替代圖像中使用某種換行符嗎？替代文字中的換行

事情是這樣的......

<img src="foo.jpg" alt="Line 1\nLine 2" />

我這麼問是因爲我想發佈在我的網站下面的截圖，但我想在搜索引擎優化的原因alt文本的文字版本併爲視障人士。

我更喜歡純文本版的截圖，因爲它看起來更具視覺吸引力。

來源

2011-04-24 Pieter

只需使用正常換行符。

<img src="foo.jpg" alt="Line 1 
Line 2" />

堆棧溢出做到這一點在他們的頭銜:)

然後添加這個CSS：

img{white-space:pre}

演示：http://jsfiddle.net/Madmartigan/S8SXP/

來源

2011-04-24 10:43:46

只有當您希望顯示帶換行符的alt時，才需要使用CSS，如果找不到圖像。 – 2011-04-24 10:50:17

這似乎違反了XHTML 1.0嚴格標準。 – Pieter 2011-04-24 11:05:53

嗯，我在驗證器中測試並得到「此文檔已成功檢查爲XHTML 1.0 Strict！」 – 2011-04-24 11:10:15

我想你可能會過於賣力。
替代文本應該是圖像的替代品，而不是某種字面表示形式。

正確標記等，這將是一個無序列表與子列表，並且屏幕閱讀器將從HTML元素的嵌套中獲取關係信息。用一些換行符代替以獲得粗略的視覺逼近並不是一回事，例如。你如何計劃也「顯示」屏幕閱讀器，第一個換行符後面的塊是「內部」的錯誤？
我懷疑搜索引擎除了放棄它們之外，還會在替代文本中使用換行符。（誠然是推測性的）

你是什麼其實之後是以某種方式包括圖像的嵌套/關係信息，但用文本代替。從「[app]通知的截圖開始，顯示兩個錯誤[詳細信息，如果你想]和兩個信息項[細節]」等。

或者你可以真正迂腐，實際上創建列表HTML，然後使用圖像替換技術插入圖像。

來源

2011-04-24 10:57:47

同意這一點，alt屬性不應該用這種方式，再加上換行符/換行符沒有語義含義，所以沒有必要。理想情況下，CSS解決方案是最好的（只是像圖片那樣），但如果圖像是首選的，那麼圖像替換技術太容易了。我從字面上回答了這個問題，但我認爲這是大局的最佳答案。 +1 :) – 2011-04-24 11:14:23

我發現這在圖像替換... http://www.dave-woods.co.uk/?p=124圖像替換似乎是一個很好的解決方案靜態網站，但我使用WordPress的CMS。有沒有辦法讓這個過程自動化一點點？因爲每次使用這種技術都不得不編輯我的樣式表。 – Pieter 2011-04-24 11:43:28

@ Murch的回答是我不知道的。然而，它在整個應用程序中將BR空間分配給BR都成爲了開銷。

作爲最簡單的解決方案，你可以只提供

img.class { overflow:hidden }

，並用它快速和骯髒的克服。

來源

2012-12-22 06:01:17

更好的方法是爲換行或回車添加HTML字符代碼。

line feed is &#10 
carriage return &#13

來源

2012-12-27 03:23:52

如果「數字字符引用擴展爲回車」，http://validator.w3.org會給你一個錯誤。 – RunnerRick 2013-10-05 00:15:49

這不是十分交叉兼容的。無法在任何瀏覽器中使用此功能。 – davidcondrey 2014-01-28 21:13:24

替代文字中的換行

回答

相關問題