通过单击纯CSS链接来移动元素

是否可以通过其他元素影响一个元素？当我点击链接a.link时，我想移动.box元素。通过单击纯CSS链接来移动元素

我试过了，但无法使其正常工作。我应该在link:active写什么？

<html> 
<head> 
<style> 

.box 
{ 
    height:100px; 
    width:200px; 
    border:solid red 5px; 
} 

.link:hover 
{ 
    color:red; 
} 

.link:active 
{ 
    color:grey; 
} 
</style> 
</head> 

<body> 
    <a href="#" class=link >CLICK ME</a> 
    <div class=box></div> 
</body> 
</html>

来源

2014-02-24 Darsh

标题与实际问题不同。这可能会导致误解。请编辑标题以更好地指出问题。但是，你可以在这里找到你的答案：http://stackoverflow.com/questions/21919044/css3-transition-on-click-using-pure-css/21919261#21919261检查第二种方法。 –

非常感谢你！我找到了我需要的东西！ – Darsh

你的问题措辞不佳，我不能很好地编辑它。你可以修改你的问题，这样更有意义吗？也许从你找到的答案中使用语言？ –

这是可能的使用兄弟/儿童选择器。选择器必须包含您正在采取行动的元素。

当您点击.link时，您希望.box移动。它们彼此相邻，因此您可以使用相邻的兄弟选择器.link:active + .box。

您可以使用转场对动作进行动画处理。

请参阅：http://jsfiddle.net/2P4aA/2/

来源

2014-02-24 21:02:06

通过单击纯CSS链接来移动元素

回答

相关问题