首页 > 请教各位前端技术大牛 这段代码效果是怎么实现的

请教各位前端技术大牛 这段代码效果是怎么实现的

本人想转一位大牛的文章 发现他的文章代码有左右拉动的滑动栏的效果。。。或者说是怎么添加滑动栏吧 如图


这个应该是网页css样式的设置吧。比如如果代码是使用code框起来的,那么code的样式就是

code {
    white-space:nowrap;  //内容横向排列不换行
    overflow-x:auto;    //横向滚动条自动出现
    overflow-y:hidden;    //纵向滚动条隐藏,且隐藏文字溢出部分。
}

<div style="width:200px;overflow: auto">
    <p>1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111</p>
</div

Scrollbar 的顯示策略由 CSS 控制,具體爲 overflow 屬性。

還有用 Chrome 瀏覽器右鍵審查元素有驚喜哦~ 要學會自己用工具分析。

【热门文章】
【热门文章】