# saduocss

**Repository Path**: chancms/saduocss

## Basic Information

- **Project Name**: saduocss
- **Description**: 一个轻量级、自适应（PC/WAP）、无需编译的原子CSS样式库。
- **Primary Language**: Unknown
- **License**: Apache-2.0
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 1
- **Created**: 2025-12-28
- **Last Updated**: 2026-03-30

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 💒saduo.css

一个轻量级的CSS样式库，提供了一系列原子类，用于快速构建响应式网页。

## 🌈特点介绍

* 轻量:纯css支持响应式,无需JS，支持PC、移动端。
* 实用:不需要编译，引入即用，无需额外配置。
* 小巧:33kb,最佳实践，原子类为基础，复合样式类配合使用。
  
因为轻，所以值得拥有，很好的一个原子类css样式库。

## ⛱️软件架构

* 重置和基本样式

```style
@import './reset.css';
@import './scrollbar.css';
@import './var.css';
@import './rem.css';

```

* 响应式

```style
@import './screen.css';
@import './base.css';
```

* 位置

```style
@import './row.css';
@import './col.css';
@import './position.css';
```

* 间距

```style
@import './margin.css';
@import './padding.css';
@import './top.css';
```

* 高度&高度

```style
@import './width.css';
@import './height.css';
@import './line-height.css';
```

* 列表&文本

```style
@import './list.css';
@import './text.css';
@import './font.css';
```

* 阴影

```style
@import './shadow.css';
```

* 透明度

```style
@import './opacity.css';
```

* 滤镜

```style
@import './filters.css';
```

* 颜色

```style
@import './color.css';
```

## 🚧响应式断点参考

断点设置，768px，1024px，1536px，1536px，1920px。

* 小屏幕手机

```css
@media (max-width: 768px){}
```

* 大屏幕手机/小平板

```css
@media (min-width: 769px) and (max-width: 1024px) {}
```

* 平板

```css
@media (min-width: 1025px) and (max-width: 1280px) {}
```

* 桌面

```css
@media (min-width: 1281px) and (max-width: 1536px) {}
```

* 大桌面

```css
@media (min-width: 1537px){}
```

## 使用说明

* 1.安装方式一：安装依赖包,依赖node.js环境。

```bash

npm i saduo --save
import "saduo/src/all.css";

```

* 2.安装方式二：cdn引入样式,建议下载到自己的项目中，并引入样式。

```html
<link rel="stylesheet" href="https://unpkg.com/saduo@2.0.1/dist/assets/css/saduo.css">
```

## 联系作者

```text
微信:yanyutao2014
主页：https://gitee.com/yanyutao0402/saduo
```