css固定定位,不随滚动条滚动

2021-05-30 13:00

阅读:538

YPE html>

标签:cal   height   ini   title   width   lang   viewport   固定   utf-8   





Document
{
            font-size: 60px;
            height:2000px;
        }
        .box1{
            width:200px;
            height:200px;
            background-color: rgb(192, 245, 69);
        }
        .box2{
            width:200px;
            height:200px;
            background-color:orange;
             /*
                固定定位:
                    - 将元素的position属性设置为fixed则开启了元素的固定定位
                    - 固定定位也是一种绝对定位,所以固定定位的大部分特点都和绝对定位一样
                        唯一不同的是固定定位永远参照于浏览器的视口进行定位
                        固定定位的元素不会随网页的滚动条滚动
              */
              position: fixed;
              left: 0;
              top:0;
        }
        .box3{
            width: 200px;
            height: 200px;
            background-color: yellow;
        }
        .box4{
            width: 400px;
            height: 400px;
            background-color: tomato;
        }
        
        .box5{
            width: 300px;
            height: 300px;
            background-color: aliceblue;
        }
        
    


    
1
4
5
2
3

 

css固定定位,不随滚动条滚动

标签:cal   height   ini   title   width   lang   viewport   固定   utf-8   

原文地址:https://www.cnblogs.com/hr-7/p/14671733.html


评论


亲,登录后才可以留言!