HTML 显示损坏的图像答案

【问题标题】：HTML showing broken imageHTML 显示损坏的图像
【发布时间】：2013-09-13 19:06:23
【问题描述】：

我有以下 html 代码，当我在浏览器中将其拉出时，图像要么不显示，要么显示损坏的图像：

<!DOCTYPE html>
<html>
    <head>
    <title>Lets Play Battleship</title>
    <link rel="stylesheet" href="style.css">
    </head>

    <body>
        <h1>
            Battleship
            <p><img src="battleship-game-board.jpg" width = "120" height = "90"/></p>
        </h1>


        <p><a href="http://www.freeonlinegames.com/game/battleships"> Click Here to Play Battleship</a></p>

    </body>
</html>

【问题讨论】：

确保图片与html文件所在的路径相同..

标签： html image src

【解决方案1】：

这是由于以下原因。

1>battleship-game-board.jpg不在同一个文件的同目录下。

2>battleship-game-board.jpg 不包含有效权限。如果您使用的是 linux，那么您必须在 Battleship-game-board.jpg 图像上指定 755 权限。

你可以使用

chmod 755 战舰游戏板.jpg

【讨论】：

感谢我检查的所有回复，并且文件名拼写错误。不过感谢您的回复。

【解决方案2】：

要使图像工作，您可以使用：

绝对路径：

<img src="http://www.domain.com/MyImages/battleship-game-board.jpg"/>

或

相对路径：

<img src="../MyImages/battleship-game-board.jpg"/>

如果图像存在于同一文件夹中，则 html 文件存在，那么您可以使用：

<img src="battleship-game-board.jpg" width = "120" height = "90"/>

更多详情here

注意：在所有情况下，图像都必须存在于给定路径中。

【讨论】：

【解决方案3】：

<img src="battleship-game-board.jpg" width = "120" height = "90"/>.

src="" 中的内容应该是路径，而不是图像的标题。意思是输入battleship-game-board.jpg的路径，而不是图片名称。

【讨论】：