CSS3中的拟合元素

Question

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

一切正常，但我还有另一个问题。 是否可以自动设置该行的宽度，以使该行正确适合，而无论链接文本的长度如何？ 关键是当我的标题较长时，此行太短。

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

Answer 1

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

.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个变化，您的小提琴在结尾时缺少右括号