王娟-2020-10-30

*{
    margin: 0;
    padding: 0;
    border: 0;  
}/*常规*/
    width: 48px;
    height: 24px;
    color: #fff !important;
    text-align: center;
    line-height: 24px;
    background-color: #4e71f2;
    display: inline-block;/*让行级标签拥有块级标签的特性(自定义大小)依旧保留行级标签不独占一行的特性*/
    border-radius: 6px;

    width: 544px;
    height: 40px;
    float: left;
    border-top: 2px solid #c4c7ce;
    border-left: 2px solid #c4c7ce;
    border-bottom: 2px solid #c4c7ce;
    border-radius: 10px 0 0 10px;
    position: relative;/*父容器相对*/

.inp span{
    width: 24px;
    height: 20px;
    display: inline-block;
    background: url(../img/nicon.png);
    background-position: 0 -50px;
    cursor: pointer;
    position: absolute;/*子容器绝对*/
    position: sticky;/*粘性定位*/
    /*position: relative;/*1.相对定位*/

    /*position: absolute;/*1.绝对定位(父相对,子绝对)*/
    position:fixed ;/*固定位置(脱离原文档流)*/
/*测试样式*/
.bg{
    background: indianred;
}

总结心得:今天老师着重就昨天的作业给我们进行了讲解,通过老师的讲解使自己的迷惑点得到解决。

标签

评论

© 2021 成都云创动力科技有限公司 蜀ICP备20006351号-1