a img {
width:3%;
text-decoration:none;
margin-left:10px;
}
a {
top: 10px;
left: 10px;
position: absolute;
color: #090909;
}
<a href="#">View <img src="https://cdn1.iconfinder.com/data/icons/internet-28/48/31-512.png"> </a>
如何使图像(箭头)变为 5px
向右所以 margin-left: 15px;
当父标签<a>
一直徘徊在?如果没有 javascript 或 jquery,这可能吗?
最佳答案
请试试这段代码
a img {
width:3%;
text-decoration:none;
margin-left:10px;
transition:0.5s;
}
a {
top: 10px;
left: 10px;
position: absolute;
color: #090909;
}
a:hover img{
opacity: 1;
margin-left: 50px;
transition: all 0.5s ease-out;
-webkit-transform: rotate(177deg);
zoom: 1;
}
<a href="#">View <img src="https://cdn1.iconfinder.com/data/icons/internet-28/48/31-512.png"> </a>
关于html - 当元素 Y 悬停时移动元素 X?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57630949/