設(shè)置右側(cè)滾輪在網(wǎng)頁設(shè)計與開發(fā)中是非常常見的。通過CSS的overflow屬性和overflow-y屬性即可輕松實現(xiàn)。下面就來詳細介紹一下如何設(shè)置右側(cè)滾輪。
/*設(shè)置右側(cè)滾輪*/ overflow: auto; /*開啟滾動條*/ overflow-y: scroll; /*只顯示垂直滾動條*/
這里,我們需要使用CSS中的overflow屬性。這個屬性規(guī)定一個元素的內(nèi)容超出其框時發(fā)生的事情。
對于overflow屬性,有以下值:
- visible:默認值,內(nèi)容不會被修剪,會呈現(xiàn)在元素框之外
- hidden:內(nèi)容會被修剪,僅呈現(xiàn)在元素框之內(nèi)
- scroll:內(nèi)容會被修剪,但是會出現(xiàn)滾動條以便查看剩余部分
- auto:如果內(nèi)容被修剪,則會出現(xiàn)滾動條以便查看剩余部分
除此之外,我們還需要使用overflow-y屬性來控制只顯示垂直滾動條。這個屬性規(guī)定元素的垂直溢出如何被處理。有以下值:
- visible:默認值
- hidden:溢出內(nèi)容會被裁剪,并且不會出現(xiàn)滾動條
- scroll:溢出內(nèi)容由滾動條處理,可以看到裁剪的元素
- auto:如果溢出內(nèi)容,則由滾動條處理,否則不顯示滾動欄。
綜上所述,我們只需要在需要滾動條的元素上添加上面的CSS樣式即可實現(xiàn)右側(cè)滾輪的設(shè)置。
下一篇css中文字置頂