使用elementUI滾動條之橫向滾動

2021-09-12 10:24:26 字數 596 閱讀 6967

用過elementui元件應該會知道它內建乙個滾動效果,官網對此元件沒有相關文件,也是細心網友發現的。

將會出現滾動的內容放到上述標籤內就可以了。 

這裡要簡單的設定一下,將標籤的height設為100%,讀者檢視效果的時候,會出現乙個橫向的滾動條,如果你不想要橫向的滾動條,使用下面css屬性設定就可以只顯示豎向滾動條。

.el-scrollbar__wrap
示例使用如下:  

以上是常見的用法。

如果需求橫向滾動,可以使用這個方法。參照上面的用法,前提是li標籤的內容需要浮動或者 display:inline-block; 然後高度按需要定義

.el-scrollbar .el-scrollbar__wrap .el-scrollbar__view
posted @

2019-01-31 10:15

<_> 閱讀(

...)

編輯收藏

elementUI 滾動條元件

elementui 中有乙個隱藏元件,用來修改滾動條的樣式 1.元件名稱 2.修改預設樣式 最好在前面加上 class名 id名,用來區別 page component scroll el scrollbar wrap 一種情況用於高度固定 blabla.一種情況用於高度100 自適應 123 樣式...

element ui的滾動條的使用

如何使用element ui 自帶的滾動條 在需要滾動條的容器外層 需要滾動條的容器 這個容器需要限定高度哦 如height 100 如height calc 100 60px 等 全域性樣式 如果只需要y軸的滾動條 el scrollbar wrap el scrollbar bar.is hor...

Element UI 中被隱藏的滾動條

element ui 官網中有用到自定義的滾動條元件,但是發布的所有版本中都不曾提及,個中原因我們不得而知,不過我們還是可以拿過來引用到自己的專案中。使用的時候,放在標籤內即可 如 div style height 100 el scrollbar class m scroll style heig...