如何将徽标添加到我的 html 网站？只显示一个小图标而不是整个图片

Question

正在尝试将 4 dry out 徽标添加到此 html 模板。谁能纠正我做错了什么？它在网站上显示：

这是代码的一小部分，我将图像放在正文中。

<body>
    <!-- Loader -->
    <div id="loader-wrapper">
        <div id="loader"></div>
        <div class="loader-section section-left"></div>
        <div class="loader-section section-right"></div>
    </div>
    
    <!-- Page Content -->
    <div class="container-fluid tm-main">
        <div class="row tm-main-row">

            <!-- Sidebar -->
            <div id="tmSideBar" class="col-xl-3 col-lg-4 col-md-12 col-sm-12 sidebar">

                <button id="tmMainNavToggle" class="menu-icon">&#9776;</button>

                <div class="inner">
                    <nav id="tmMainNav" class="tm-main-nav">
                        <ul>
     <!--ERROR IMG -->      <img data-image="4 Dry Out Logo.jpg" alt="4 Dry Out Logo">
                            <li>

Answer 1

除非有其他代码作用于您的 img 标签，否则您需要使用 src 属性来指定图像 URL。图片名称中的空格也可能导致问题。

您需要打开网络浏览器的开发人员工具，看看是否可以在网络选项卡中看到请求图像的位置。如果 URL 返回 404 错误，您就知道图像路径存在问题。如果根本没有发出图片请求，则说明您的 img 标签或导致发送图片请求的代码有问题。

Answer 2

    <img data-image="4DryOutLogo.jpg" alt="4 Dry Out Logo">

首先你需要考虑重命名图像并从名称中删除白色 space。

其次，你必须使用下面的代码

    <img src = "../yourimagename.jpg">

最后，您必须确保您的图像存在于服务器路径中。我建议您先通过 url link 打开图片，打开后将 url 复制粘贴到 src 代码中。

祝你好运

如何将徽标添加到我的 html 网站？只显示一个小图标而不是整个图片

How do I add a logo to my html website? Only showing a little icon instead of the entire pic

html

image

broken-image