发表于: 2019-11-29 21:17:02

2 875


今天完成的事情:

1.修改任务8,9 

明天计划的事情:

任务

遇到的问题:

收获:

修改任务8、9出现的错误

感谢师兄为我指出的各个不足之处,最近毕业有点忙今天才修完,以下为收获分析:

1.boostrap的响应式导航栏

             <nav class="navbar navbar-default" role="navigation">

                   <div class="navbar-header">

                     <!-- 汉堡按钮 -->

                      <button type="button" class="navbar-toggle" data-toggle="collapse" 

                         data-target="#example-navbar-collapse">

                         <span class="sr-only">切换导航</span>

                         <span class="icon-bar"></span>

                         <span class="icon-bar"></span>

                         <span class="icon-bar"></span>

                      </button>

                   </div>

                   <!-- 折叠列表 -->

                   <div class="collapse navbar-collapse" id="example-navbar-collapse">

                      <ul class="nav navbar-nav">

                         <li class="active">

                             <a href="index.html">首页</a>

                         </li>

                         <li>

                             <a href="profession.html">职业</a>

                         </li>

                         <li>

                             <a href="profession.html">推荐</a>

                         </li>

                         <li>

                             <a href="company.html">关于</a>

                         </li>

                      </ul>

                   </div>

                </nav>

参考修改样式资料:https://ask.csdn.net/questions/706081

https://www.cnblogs.com/CherishZeng/p/9525497.html

https://wenda.so.com/q/1468810499720081

2.css3动画

首先定义一个动画,然后在css选择器的animation属性中使用。

@keyframes myfirst{

    0% {

        top: -100%;  /* position的top值使用百分比,相对于其父元素 */

    }

    100% {top: 0;}

}

@keyframes中除了百分比,也可以用from、to

.hidde {

    display: none;

    position: absolute;

    top: 0;

    left: 0;

    z-index: 1;

    width: 270px;

    height: 312px;

    padding: 0 15px;

    font-size: .7rem;

    animation: myfirst 1s; /*“myfirst”这个动画的时长为1s */

    color: #fff;

    background: rgba(120,120,120,.8);

}


返回列表 返回列表
评论

    分享到