HTML 显示损坏的图像

标签 html image src

我有以下 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>

最佳答案

要使图像工作,您可以使用:

绝对路径:

<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

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

关于HTML 显示损坏的图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18712701/

相关文章:

javascript - 在 Openlayers3 中的图层上拖动、调整图像大小和旋转图像

jquery - 如果 $ ('img' ).attr ("src", "")

jquery - 使用 jQuery 根据滚动位置增加图像 src

jquery - 用 jquery 交换图像 src

javascript - 单击 anchor 标记时添加效果

javascript - HTML 重命名下载链接

javascript - 我在将英寸转换为厘米的转换表时遇到问题

css - html 和 css 中的标题横幅

php - 用 iPad 上传的照片是旋转的

java - iText 忽略图像后添加的空间