安装

yu.css.ui 纯CSS通用UI模块和组件

yu.css.ui 只写CSS样式和HTML示例，不包含任何JavaScript脚本，在javascript，jquery, vue, react, angular, webpack, npm 下都可以快速使用。只要添加一些简单的脚本逻辑，就可以形成完整的组件。

原则

• 不包含任何JavaScript脚本
• 通过className可以显示和控制组件的所有状态
• 一个组件只有一个顶级命名空间，即yu-xxx
• 每个组件css都可以独立拆分直接使用，不需要额外引入重置样式或者变量

一、npm 引入

推荐

引入所有组件样式

方式一: 在js中

方式二: 在scss中

引入编译打包后的css文件

引入scss源码，效果和上面相同 (优点：可以通过变量声明前置，覆盖默认变量)

引入单个或多个组件样式

选择性引入，避免引入不使用的组件，减少css打包体积

方式一: 在js中

方式二: 在scss中

二、使用CDN引入

目前可以通过 unpkg.com/yu.css.ui 获取到最新版本的资源，在页面上引入 css 文件即可开始使用。

三、项目源码地址

Github 项目地址 点击

四、不引入，直接复制使用

每个组件下面都会有CSS和HTML，点击复制即可使用

复制按钮HTML

复制按钮CSS

快速上手：Hello World

最终结果