css - css3中的拟合元素

Question

两天前，我向动画 css3 寻求帮助。这是我的动画：[链接]http://jsfiddle.net/SD58Z/8/[/link]

一切正常，但我还有另一个问题。是否可以自动设置这条线的宽度，无论链接文本的长度如何，这条线都适合吗？关键是当我的标题较长时，这条线太短了。

我刚刚创建了一个 mod 并且线条显示正确，但我的动画消失了。[链接]http://jsfiddle.net/DashDesign/SD58Z/284/[/link]

Answer 1

我不确定您要做什么，但这会使下划线跨度为 500 像素。

.line{
font-family:Tahoma;
width:0px;
position: absolute;


background:black;
transition:width 0.4s ease ;
-moz-transition: 0.4s ease ; /* Firefox 4 */
-webkit-transition: 0.4s ease ; /* Safari and Chrome */
-o-transition: 0.4s ease; /* Opera */
}

div:hover{
width:500px;
}
.line div{
    background:#fff;
    position:relative;
    bottom:1px;
}
}

2个变化是悬停时的宽度，你的小提琴最后缺少一个右括号