不知道有沒有小夥伴遇到過這樣的問題,文字太多,需要隱藏,但是產品和設計覺得你overflow出來的滾動條太low,使用者體驗不好?fk,心中一萬個尼瑪,但是還是要優化,畢竟如今使用者為王,流量至上。今天就來用css實現完美的滾動,讓你的專案更上一層樓,讓產品設計統統shut up、、、 廢話不多說,直接上程式碼,其實很簡單一行程式碼搞定,但是還是會有初學的小夥伴看著雲山霧繞,因為我也是從小白一步步走過來的,所以最後用例子說話了。
<div class="scroll-hidden">
這裡是需要滾動的內容,可能有很多,幾萬行哈哈哈
</div>
.scroll-hidden {
width: 100px;
height: 300px;
overflow: auto
}
來畫重點:
.scroll-hidden::-webkit-scrollbar {
display: none;
}
複製程式碼
至此可以說的一行程式碼搞定,是不是soeasy?所以啊活到老學到老,知識是無限的,能力是有限的,為了能夠在有限的生涯裡學到無限的知識,我們要珍惜每一次能夠學習的機會,fight!擼起袖子加油幹!