Careful_S 2024-08-16 09:56 采纳率: 33.3%
浏览 3

html</body>后无中生有多出了一个元素div

我将代码托管在GitHub内:
我的网站
GitHub
代码:

<html>
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>图例</title>
    <link rel="icon" type="image/png" href="../../Favicon.png">
    <style>
      body{
        background-color: #5d4ea8;
        margin: 0;
        padding: 20px;
      }
      .Top{
        background-color: #5d4ea8;
        border: 3px solid #24f0ea;
        padding: 10px;
        color: #24f0ea;
        box-shadow: 0px 17px 25px #55367a;
        margin: 0;
        position: fixed;
        right: 0px;
        left: 0px;
        top: 0px;
        border-radius: 0px 0px 17px 17px;
        z-index: 999
      }
      h1{
        color: #24f0ea;
        text-shadow: 10px 10px 17px #55367a;
      }
      p{
        margin: 0;
      }
      div{
        background-color: #a0a2de;
        border: 3px solid #24f0ea;
        padding: 10px;
        margin-top: 10px;
        border-radius: 17px;
        color: #55367a;
        box-shadow: 10px 10px 17px;
      }
    </style>
  </head>
  <body>
    <br/>
    <div class="Top">
      <p>Ckarefulon</p>
    </div>
    <h1>图例</h1>
    <div><p>=\t颜色相同</p></div>
    <div><p>↔\t颜色相对,如蓝↔绿</p></div>
    <div><p> - \t颜色不同,如红 - 蓝</p></div>
    <div><p>√\t颜色已在正确的位置</p></div>
  </body>
</html>

但是网站在审查元素时无中生有多出了一个div
如图:

img

div代码如下:

<div style="position: absolute; top: 0px; right: 0px; width: 100%; z-index: 2147483647;"><style>
        @font-face {
            font-family: "cicons";
            font-weight: 400;
            font-style: normal;
            src: url(chrome-extension://elgjjjejoajmgnljkhfjilkjnkgfkkba/assets/font/cicon_43e43c5.woff) format("woff"),
                url(chrome-extension://elgjjjejoajmgnljkhfjilkjnkgfkkba/assets/font/cicon_ab43222.svg?#cicons) format("svg");
        }

        @font-face {
            font-family: "cosmicIcon";
            font-weight: 400;
            font-style: normal;
            src: url(chrome-extension://elgjjjejoajmgnljkhfjilkjnkgfkkba/assets/font/cicon_43e43c5.woff) format("woff"),
                url(chrome-extension://elgjjjejoajmgnljkhfjilkjnkgfkkba/assets/font/cicon_ab43222.svg?#cicons) format("svg");
        }</style></div>

正确的:

img

错误的:

img

注:使用的是新版 Edge 浏览器

非常感谢您的回复!

  • 写回答

3条回答 默认 最新

  • 一直免费一直爽 2024-08-16 09:56
    关注

    以下回复参考:皆我百晓生券券喵儿等免费微信小程序作答:

    从您提供的代码和截图来看,问题出在您的网页中有一个额外的<div>元素,它包含了一些样式和字体信息。这个<div>元素的样式设置为绝对定位,覆盖了整个页面,导致其他内容被遮挡。

    要解决这个问题,您可以尝试以下方法:

    1. 检查您的代码,确保没有重复或多余的<div>元素。如果有,请删除它们。
    2. 如果问题仍然存在,可能是浏览器插件或其他扩展程序导致的。尝试禁用所有可能影响页面显示的扩展程序,然后刷新页面查看是否解决了问题。
    3. 如果上述方法都无法解决问题,您可以考虑使用开发者工具(如Chrome的开发者工具)来调试页面。通过检查元素面板,您可以找到并删除那个多余的<div>元素。具体操作如下:
      • 打开开发者工具(快捷键:F12或者右键点击页面,选择“检查”)
      • 切换到“Elements”(元素)面板
      • 在元素树中找到那个多余的<div>元素,它的样式应该与您提供的错误截图中的一致
      • 右键点击该元素,选择“Remove element”(移除元素)或者直接删除该元素的HTML代码
      • 保存更改并刷新页面,查看问题是否解决

    希望这些建议能帮助您解决问题。如果问题仍然存在,请随时提问。

    评论

报告相同问题?

问题事件

  • 创建了问题 8月16日

悬赏问题

  • ¥15 如何在vue.config.js中读取到public文件夹下window.APP_CONFIG.API_BASE_URL的值
  • ¥50 浦育平台scratch图形化编程
  • ¥20 求这个的原理图 只要原理图
  • ¥15 vue2项目中,如何配置环境,可以在打完包之后修改请求的服务器地址
  • ¥20 微信的店铺小程序如何修改背景图
  • ¥15 UE5.1局部变量对蓝图不可见
  • ¥15 一共有五道问题关于整数幂的运算还有房间号码 还有网络密码的解答?(语言-python)
  • ¥20 sentry如何捕获上传Android ndk 崩溃
  • ¥15 在做logistic回归模型限制性立方条图时候,不能出完整图的困难
  • ¥15 G0系列单片机HAL库中景园gc9307液晶驱动芯片无法使用硬件SPI+DMA驱动,如何解决?