如何使用顯示圖像 <img> 在簡單的HTML 5文件中？

Question

我的問題是我可以在簡單的HTML 5文件中使用<img>標簽顯示圖像嗎？

我在線和離線使用wampserver嘗試了下面顯示的test.html文件。 但是結果幾乎是一樣的。

文件路徑是

C:\wamp\www\fluid\SMS\test\test.html
C:\wamp\www\fluid\SMS\test\stack.jpg
C|/Users/aimme/Desktop/stack.jpg

這是test.html

<html>
    <head>
    </head>
    <body>
         <!-- works on internet explorer
         doesn't work on other ff & chrome -->
         <img src="file:///C|/Users/aimme/Desktop/stack.jpg" alt="stack img from my desktop" width="500" height="100"/>
         <!--doesn't work on ie,ff or chrome-->
         <img src="stack.png" alt="stack img from same folder" width="100" height="100"/>
         <!--doesn't work on ie,ff or chrome-->
         <img src="cdn.sstatic.net/stackoverflow/img/apple-touch-icon@2.png" alt="stack img from site" height="100" width="100">
    </body>
</html>

這是結果。

如何在Internet Explorer 11.0.9600.17031版本中看到 在Firefox 40.0.3中如何看待 在Chrome 47.0.2503.0 dev-m（64位）中如何看待

Answer 1

一些東西：

我懷疑Chrome和FF不喜歡"file:///C|/Users/aimme/Desktop/stack.jpg"的豎線字符，這就是為什么它在那里失敗的原因。
如果文件名為stack.jpg ，則需要包含.jpg擴展名才能起作用。
您想在遠程URL中使用該協議，否則將被視為相對的： <img src="http://cdn.sstatic.net/stackoverflow/img/apple-touch-icon@2.png" alt="stack img from site" height="100" width="100">

Answer 2

請注意，沒有結束標記。 這是不使用它們的少數元素之一。

<img src="Desktop/stack.jpg" class="flr" alt="Lake Atitlan, Guatemala" width="300" height="240">

提供圖像的相對路徑。

有關更多詳細信息，請參考以下鏈接：
http://www.html-5-tutorial.com/image-element.htm

Answer 3

嘗試

<img src="stack.jpg" />

文件stack.jpg與HTML文件位於同一目錄中。

對於遠程文件，請輸入完整的URL，即http：// ...

如何使用顯示圖像 <img> 在簡單的HTML 5文件中？

問題描述

3 個解決方案

解決方案1
3 2015-09-12 09:09:59

解決方案2
1 2015-09-12 09:07:04

解決方案3
1 2015-09-12 09:07:32

如何使用顯示圖像 <img> 在簡單的HTML 5文件中？

問題描述

3 個解決方案

解決方案1 3 2015-09-12 09:09:59

解決方案2 1 2015-09-12 09:07:04

解決方案3 1 2015-09-12 09:07:32

解決方案1
3 2015-09-12 09:09:59

解決方案2
1 2015-09-12 09:07:04

解決方案3
1 2015-09-12 09:07:32