#css# exceeds the height, can scroll up and down

<div class="test">
    <div class="item" v-for="list in 10" >
        <p class="title">这是一条数据</p>
    </div>
</div>

Add the following code inside the largest div

.test {
       width: 200px;
        max-height: 300px; //设置最大的高度
        overflow:auto; // 超出这个最大高度的数据,会被隐藏起来,上下滑动
        overflow-x:hidden; //隐藏x轴滚动条
        .item {
            width: 90%;
            margin: auto;
            text-align: center;
            .title {
                width: 100%;
                font-size: 15px;
                font-weight: normal;
                background-color: #999999;
            }
        }
    }

If you want to hide the scrollbar, you can use the following code

 .test::-webkit-scrollbar {
        display: none;
    }

 

Guess you like

Origin blog.csdn.net/ZHENGCHUNJUN/article/details/128465398