简介
uis（UI Style）是一个基于 Sass 和 BEM 的 CSS 样式库，适用于快速搭建 Web 前端界面。该包中包含了一系列常用的 UI 样式，如按钮、表单、列表等。
安装
可以使用 npm 或 yarn 安装 uis 包：
--- ------- ---
或
---- --- ---
使用
在 HTML 文件中，引入 uis.css 文件：
----- ---------------- -----------------------
然后就可以直接使用 uis 中的样式类了。
比如，如果要使用 uis 中的按钮样式，可以在 HTML 文件中这样写：
------- --------------------------
组件
以下是 uis 中常用的一些组件和样式类。
按钮
.button：普通按钮。.button-primary：主要按钮，通常用于强调主要操作。.button-secondary：次要按钮，通常用于辅助操作。.button-success: 成功按钮，通常用于表示操作成功。.button-danger: 危险按钮，通常用于表示操作可能会导致不良后果。
------- ---------------------------- ------- ------------------------------------ ------- -------------------------------------- ------- ------------------------------------ ------- -----------------------------------
表单
.form：表单容器。.form-group：表单组，通常包含标签和输入框。.form-label：表单标签，通常用于描述输入框的内容。.form-input：表单输入框，通常用于输入内容。.form-textarea：表单文本框，通常用于输入多行内容。.form-select：表单下拉框，通常用于输入选项。.form-radio：单选框。.form-checkbox：复选框。
----- -------------
---- -------------------
------ ------------------ --------------------------
------ ------------------ ----------- ------------- ---------------------
------
---- -------------------
------ ------------------ -------------------------
------ ------------------ --------------- ------------- --------------------
------
---- -------------------
------ ------------------ -----------------------
------- ------------------- ------------
------- -----------------------
------- -----------------------
------- -------------------------
------- -------------------------
---------
------
---- -------------------
------ -----------------------------
---- ----------------------
------ --------------- ----------- ------------ ----------------
------ -----------------------
------
---- ----------------------
------ --------------- ----------- ------------ ---------------
------ -----------------------
------
------
------- ----------------------------------
-------列表
.list：列表容器。.list-item：列表项。
--- ------------- --- --------------------- ------ --- --------------------- ------ --- --------------------- ------ -----
总结
在本文中，我们学习了如何使用 npm 包 uis 快速搭建 Web 前端界面。通过本文所介绍的组件和样式类，可以帮助我们快速构建出漂亮而又实用的前端界面。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/74959