我正在使用 LESS 开发一个简单的进度条(我刚开始)。
[Codepen] http://codepen.io/mustafoski/pen/ybbVvJ
我不太确定问题出在哪里,但是如果您将鼠标悬停在空栏或 h2 上,您会看到该栏正在填满。您可以看到的问题是,栏位于占位符的顶部。
它应该是这样的:http://codepen.io/mustafoski/pen/VbpBEe (我不明白,为什么我可以毫无问题地发布这个url)
我不知道我做错了什么。
谢谢。
BR 阿里木
最佳答案
经过一段时间的尝试,我想通了。代码没问题,只是悬停部分缺少一个类。
如果你要看我的笔,你会看到这个:
旧的:
.bar(@widthInPercent)
{
position:relative;
content:"";
width:0px;
height:35px;
background-color: @green;
margin-top:0px;
margin-left:0px;
margin:0px !important;
transition: all 1s ease-in-out;
&:hover
{
width:@widthInPercent;
}
}
新:
.bar(@widthInPercent)
{
position:relative;
content:"";
width:0px;
height:35px;
background-color: @green;
margin-top:0px;
margin-left:0px;
margin:0px !important;
transition: all 1s ease-in-out;
&:hover .bar /*This Class was missing*/
{
width:@widthInPercent;
}
}
谢谢大家:)
关于html - 进度条没有出现在它应该出现的位置,带有悬停,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43706836/