ShadowUI3

# ShadowUI3 CSS 文档

ShadowUI3 提供了一套完整的 CSS 样式体系，包括基础样式、组件样式和工具类，方便开发者在不使用 Vue 组件的情况下也能使用 ShadowUI3 的样式。

信息加载中

# 快速开始

# 引入 CSS

<!-- 通过 CDN 引入 -->
<link rel="stylesheet" href="https://shadow-ui3-demo.nooko.cn/static/css/shadow-ui.css">

<!-- 或通过 npm 安装后引入 -->
<link rel="stylesheet" href="node_modules/shadow-ui3/dist/css/shadow-ui.css">

# 基础使用

<div class="ui-flex">
  <div class="sidebar" style="background: #f0f0f0; width: 200px; padding: 20px;">侧边栏</div>
  <div class="content" style="background: #fff; padding: 20px; flex: 1;">主内容</div>
</div>

<i class="ui-icon ui-icon-home"></i>

# 目录结构

  • 颜色系统：完整的颜色体系，包括主色调、功能色、中性色和渐变色
  • 布局系统：提供灵活的布局解决方案
  • 图标库：丰富的图标集合
  • 工具类：常用的 CSS 工具类
  • 主题定制：如何自定义主题样式
  • 组件样式：各组件的 CSS 类名和样式说明

# 浏览器支持

  • Chrome (最新版)
  • Firefox (最新版)
  • Safari (最新版)
  • Edge (最新版)

在线演示

扫码或点击链接在手机上查看完整演示

https://shadow-ui3-demo.nooko.cn

颜色系统 →