URL中的CSS选择器

当你有这样的网址www.example.com/#signup时，浏览器所做的只是将它的视图集中在ID为signup的HTML元素上，是吗？URL中的CSS选择器

如果以这种方式聚焦，是否可以更改元素的CSS样式？

例如假设我有一个div元素，ID为signup，那么如果我输入www.example.com，div的背景是白色，如果我输入www.example.com/#signup它是黄色的。就像“强调”注册表单一样。这是可能吗？

2012-02-25 federicot

:target { background-color: yellow; }

:target psuedo-class正是这样做的。

来源

2012-02-25 08:39:43

不错......这款产品是否适用于旧版浏览器？ – federicot 2012-02-25 08:41:05

我不确定。说实话，可能不会，但可以通过JS来补救：var a = document.getElementById（location.hash.substr（1））;如果（a）a.style.backgroundColor ='黄色';' – 2012-02-25 08:42:14

@John Doe：不是IE8和更老的。 – BoltClock 2012-02-25 14:45:02

当页面加载并应用相应的css类时，您可以阅读window.location.hash属性。类似于：

<script type='text/javascript> 
function init(){ 
    var hash = window.location.hash.substr(1); 
    var element = document.getElementById(hash); 
    if(element){ 
     element.className += " emphasize"; 
    } 
} 
</script> 

<body onload="init()"> 
... 
</body>

来源

2012-02-25 08:42:52

谢谢，我会尝试 – federicot 2012-02-25 09:05:23

URL中的CSS选择器

回答

相关问题