css -在其他方向上扩展宽度
css -在其他方向上扩展宽度
提问于 2013-03-19 16:06:09
我有一些图标，当我悬停它们时，它们会展开：
.icon
{
width: 128px;
height: 128px;
background: url(icons.png) no-repeat;
background-position: left top;
-webkit-transition: width .2s;
}
.icon.icon1:hover
{
width: 270px;
backgorund-position-x: -128px;
}当我将鼠标悬停在图标上时，它的宽度会发生变化，因此-webkit-transition将展开该图标。它的扩展方式是从左到右，这对.icon1和.icon2是有利的，但对于.icon3和.icon4应该是相反的(从右到左)。
回答 1
Stack Overflow用户
回答已采纳
发布于 2013-03-19 16:10:53
使用position:absolute并设置right:0和top:0
.icon{
width: 128px;
height: 128px;
background: url(icons.png) no-repeat red;
background-position: left top;
-webkit-transition: width .2s;
position:absolute;
top:0; right:0;
}
.icon:hover{
width:250px
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/15494296
复制相关文章
相似问题
腾讯云开发者
