css上下滚动条代码

CSS上下滚动条，可以让网页的内容在超出预设高度，产生滚动条的情况下，在不改变排版情况下更加美观和时尚。CSS的上下滚动条可以通过CSS选择器来进行设置，可以设置滚动条的颜色、宽度、滚动按钮的颜色等。

/* 定义滚动条的样式 */
.scrollbar::-webkit-scrollbar {
    width: 10px;
}

.scrollbar::-webkit-scrollbar-track {
    background: #f1f1f1;
}

.scrollbar::-webkit-scrollbar-thumb {
    background-color: #c1c1c1;
    height: 50px;
}

/* 设置滚动条的位置 */
.container {
    width: 400px;
    height: 300px;
    overflow-y: scroll;
}

/* 滚动条的HTML代码 */
<div class="scrollbar">
    <div class="container">
        <p>这里是需要显示的内容。</p>
    </div>
</div> 

上面的CSS代码中，我们定义了滚动条的样式、滚动条轨道、滚动条按钮颜色等，然后通过设置容器的高度和溢出属性来控制滚动条的位置。在HTML代码中，我们需要把滚动条包在一个容器中，然后将需要显示的内容放在容器中即可。

使用CSS上下滚动条，可以让网页更加美观和时尚，增强用户体验和网站的互动性。