Bootstrap-layout-scrollable 是一款基于 Bootstrap 的滚动布局插件，它非常适用于页面上需要滚动显示的大量内容。本文将为大家介绍 bootstrap-layout-scrollable 的使用和配置方法。
安装
运行以下命令安装 npm 包：
--- ------- --------------------------- ------
配置
引入样式
在 html 中引入 bootstrap-layout-scrollable 样式文件：
----- ---------------- ---------------------------------------------------------------------------------
引入 js
在 html 中引入 bootstrap-layout-scrollable.js：
------- ---------------------------------------------------------------------------------------
HTML 结构
你需要定义一个 Bootstrap 的 container，然后根据你的具体布局使用 row、col 类来布局内容。最后，你需要将 row 元素包裹在 scrollable 类中，这样 scrollable 内容将具有滚动条。
---- ------------------
---- -------------------
---- ------------
---- --------------------------
---- --------------------------
------
---- ------------
---- --------------------------
---- --------------------------
------
------
------选项
bootstrap-layout-scrollable 提供了一些选项来进行个性化配置。
滚动条颜色
---- ------------------ ------------------------------ ---- ------
滚动条尺寸
---- ------------------ ---------------------------
滚动条位置
---- ------------------ ---------------------------------
代码示例
HTML：
---- ------------------
---- ------------------ ------------------------------ --------------------------
---- ------------
---- -----------------------------
---- -----------------------------
------
---- ------------
---- -----------------------------
---- -----------------------------
------
---- ------------
---- -----------------------------
---- -----------------------------
------
---- --- ---
------
------JavaScript：
-------------------------- -- -
-----------------------------
---------------------- ----
---
---总结
bootstrap-layout-scrollable 是一个简单易用的滚动布局插件，提供了多个选项来个性化配置。希望本文对你有所帮助，能够让你更好地使用 bootstrap-layout-scrollable 完成你的工作。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/60066c81ccdc64669dde4cee