更新

Question

每当我检查导航菜单中的任何元素，或者检查元素然后浏览到导航菜单时，我会在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>

顺便说一下，我试过三台电脑。

Answer 1

问题似乎是您的style.css文件的问题。在该文件中，您有：

/*::selection {
    background: #666; /* Safari */
    color: #FFF;
}

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

正在发生的事情是你在上面整个代码段的更广泛的评论中有一条评论/* Safari */，这会过早地关闭更广泛的评论并导致CSS的解析错误。谷歌浏览器对格式错误的CSS文件感到窒息，导致“喔喔！”检查元素时发生错误。

删除/* Safari */评论无法解决该问题，因为它下方的/* Firefox */会导致同样的问题。

编辑：虽然这确实解决了CSS的一个小问题，但它并不是整个解决方案。根据下面的thakis'答案，修复以下样式可以防止在检查元素时发生崩溃：

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

比较this fiddle，其中有问题的网站代码（所有head标记和相关的html标记）与the corrected fiddle的复制/粘贴，其中style.css标记已导入小提琴，#navigation-menu-container规则已更改为上述代码，您将看到小提琴页面不会崩溃。

Answer 2

当Chrome崩溃时，请在http://new.crbug.com处提交一个错误，以便Chrome开发人员可以解决问题。（我已为此问题提交了http://crbug.com/141139）。理想情况下，尝试制作您的网站的副本，并继续从副本中删除东西，直到您有一个仍然重现问题的小测试用例。然后将其附加到bug。

编辑：看起来你的style.css中的这个位导致它：

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

border-image需要在stretch前面显示其数字（例如http://css-tricks.com/understanding-border-image/），Chrome会因为不是这种情况而感到困惑。移动10前面的stretch修复了崩溃（但崩溃仍然是一个铬虫当然）。

＆＃39;噢，Snap！＆＃39;检查Chrome中的元素时出错

更新

2 个答案: