1

URL 片段如何与 CSS 交互？我有一个页面，说：http://example.boom/is_this_a_bug.html。该页面的代码显示在https://gist.github.com/3777018

当我用这样的 URL 加载页面时，.tab-pane元素没有显示，因为它们溢出了它们的容器，并且它有一个overflow: hidden属性。

但是，如果我通过将有效片段 ( #00) 附加到 URL 来加载页面，那么.tab-pane会变得可见，就像left:100%没有考虑到一样。按下按钮只是删除和重置left:100%，然后我得到溢出的选项卡窗格。

这发生在 Firefox 15.0.1 和 Chromium 18.0.1025.168（开发人员内部版本 134367 Linux）Ubuntu 12.04 中。

任何想法为什么会发生这种情况？这是一个错误，还是在其他地方记录？

最好的祝福，

曼努埃尔。

4

2 回答 2

1

当您在 URL 中加载带有片段标识符的页面时，如果该片段标识符与页面上元素的 ID 匹配，则浏览器将滚动页面以显示该元素。

于 2012-09-24T18:27:21.620 回答
0

另一种方法是使用 javascript 应用样式。

(function hashStyle() {

    if (window.location.hash == '#COLOR') {
        var css = document.createElement('style'),
            s = document.getElementsByTagName('script')[0],
            styles = 'body { background-color: #b0c4de; }';

        css.type = 'text/css';

        if (css.styleSheet) {
            css.styleSheet.cssText = styles;
        } else {
            css.appendChild(document.createTextNode(styles));
        }
        s.parentNode.insertBefore(css, s);
    }
})();
于 2014-09-23T01:46:36.557 回答