html
<div class="content">隱藏滾動(dòng)條隱藏滾動(dòng)條隱藏滾動(dòng)條藏滾動(dòng)條隱藏滾動(dòng)條隱藏滾動(dòng)條隱藏滾動(dòng)條隱藏滾動(dòng)條隱藏滾動(dòng)條隱藏滾動(dòng)條隱藏滾動(dòng)條隱藏滾動(dòng)條隱藏滾動(dòng)條隱藏滾動(dòng)條隱藏滾動(dòng)條隱藏滾動(dòng)條隱藏滾動(dòng)條隱藏滾動(dòng)條隱藏滾動(dòng)條隱藏滾動(dòng)條隱藏滾動(dòng)條隱藏滾動(dòng)條藏滾動(dòng)條隱藏滾動(dòng)條隱藏滾動(dòng)條隱藏滾動(dòng)條隱藏滾動(dòng)條隱藏滾動(dòng)條隱藏滾動(dòng)條隱藏滾動(dòng)條隱藏滾動(dòng)條隱藏滾動(dòng)條隱藏滾動(dòng)條隱藏滾動(dòng)條隱藏滾動(dòng)條隱藏滾動(dòng)條隱藏滾動(dòng)條隱藏滾動(dòng)條</div>
css
.content{
width: 200px;
height: 200px;
background: pink;
overflow: scroll;
}
效果如下:
有滾動(dòng)條
這樣寫可以實(shí)現(xiàn)超出部分隱藏,但是兩個(gè)滾動(dòng)條好丑啊,把它去掉就更好了
只需要在樣式文件中添加
.content::-webkit-scrollbar{
display: none;
}
效果如下:
無(wú)滾動(dòng)條