CSS实现导航栏底部动态滚动条效果

预习了CSS3部分的新知识，想着在不使用JS的情况下实现导航栏滚动条效果，如下：

实现滚动条效果，其实就是在

标签中让元素的宽度由0变化到100%，代码很简单，如下所示：

CSS样式部分：

HTML部分：

<div class="container">
    <h2>Hello World!h2>
    <div>
        <ul class="nav">
            <li><a href="">导航一a><span>span>li>
　　　　　　　<li><a href="">导航二a><span>span>li>　　
　　　　　　　　...
        ul>
    div>
div>

 

转载于:https://www.cnblogs.com/wangwz2019/p/11347692.html