html – “啊,快照!”检查Chrome中的元素时出错

前端之家收集整理的这篇文章主要介绍了html – “啊,快照!”检查Chrome中的元素时出错前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
每当我检查我导航菜单中的任何元素,或者检查元素,然后浏览到导航菜单,我会在Google Chrome中获得“Aw,Snap”错误.我认为源码一定有问题,但在编辑器中查看源代码后,似乎格式中的一切都是正确的.

可能导致此错误

你可以Click Here查看网站:)

更新:

这里的代码在这里导致错误

<li>
    <a id="nav-corporate" class="accordionButton <?PHP if (is_page(1635) || is_page(1909)) { echo "curr-page-nav";}?>">Corporate</a>
<div class="sub-list-container">

    <ul>
        <li>
            <a href="<?PHP echo get_page_link(1635); ?>" id="nav-meeting" class="subitem"><span class="nav-hidden">Meetings</span></a>
        </li>
        <li>
            <a href="<?PHP echo get_page_link(1909); ?>" id="nav-event" class="subitem"><span class="nav-hidden">Events</span></a>
        </li>
    </ul>
    </div>
    </li>

我在三台电脑上试过.

解决方法

该问题似乎是您的 style.css文件的问题.在该文件中,您具有:
/*::selection {
    background: #666; /* Safari */
    color: #FFF;
}

::-moz-selection {
    background: #666; /* Firefox */
    color: #FFF;
}*/

发生了什么事情是您在上面的整个代码段中有一个更广泛的评论/ * Safari * /,这是过早关闭更广泛的评论,并导致CSS的解析错误. Google Chrome正在堵塞格式不正确的CSS文件,导致“Aw,snap!”检查元素时发生错误.

删除/ * Safari * / comment将不会解决这个问题,因为/ * Firefox * /它导致相同的问题.

编辑:虽然这确实解决了CSS的一个小问题,但并不是整个解决方案.根据下面的thakis的解答,修复以下风格可以防止在检查元件时发生碰撞:

#navigation-menu-container{
  border-image:  url(images/shadow-border.png) 10 stretch;
}

比较this fiddle,它是所涉及的站点代码(所有头标签和相关的html标记)的复制/粘贴,其中将style.css标记导入小提琴和#导航菜单容器规则已被更改为上述代码,您将看到小提琴页面不会崩溃.

猜你在找的HTML相关文章