# oipage-stylecss

**Repository Path**: oi-contrib/oipage-stylecss

## Basic Information

- **Project Name**: oipage-stylecss
- **Description**: 常用样式或UI效果快速开发样式库
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: master
- **Homepage**: https://oi-contrib.github.io/oipage-stylecss/
- **GVP Project**: No

## Statistics

- **Stars**: 1
- **Forks**: 0
- **Created**: 2025-08-23
- **Last Updated**: 2025-11-18

## Categories & Tags

**Categories**: Uncategorized

**Tags**: Icon-font, CSS, CSS3

## README

# [@oipage/stylecss](https://github.com/oi-contrib/oipage-stylecss)
常用样式或UI效果快速开发样式库

<p>
    <a href="https://zxl20070701.github.io/toolbox/#/npm-download?packages=@oipage/stylecss&interval=7">
        <img src="https://img.shields.io/npm/dm/@oipage/stylecss.svg" alt="downloads">
    </a>
    <a href="https://www.npmjs.com/package/@oipage/stylecss">
        <img src="https://img.shields.io/npm/v/@oipage/stylecss.svg" alt="npm">
    </a>
    <a href="https://github.com/oi-contrib/oipage-stylecss/issues">
        <img src="https://img.shields.io/github/issues/oi-contrib/oipage-stylecss" alt="issue">
    </a>
    <a href="https://github.com/oi-contrib/oipage-stylecss" target='_blank'>
        <img alt="GitHub repo stars" src="https://img.shields.io/github/stars/oi-contrib/oipage-stylecss?style=social">
    </a>
    <a href="https://github.com/oi-contrib/oipage-stylecss">
        <img src="https://img.shields.io/github/forks/oi-contrib/oipage-stylecss" alt="forks">
    </a>
     <a href="https://gitee.com/oi-contrib/oipage-stylecss" target='_blank'>
        <img alt="Gitee repo stars" src="https://gitee.com/oi-contrib/oipage-stylecss/badge/star.svg">
    </a>
    <a href="https://gitee.com/oi-contrib/oipage-stylecss">
        <img src="https://gitee.com/oi-contrib/oipage-stylecss/badge/fork.svg" alt="forks">
    </a>
</p>

<img src="https://nodei.co/npm/@oipage/stylecss.png?downloads=true&amp;downloadRank=true&amp;stars=true" alt="NPM">

## 如何使用？

```
npm install --save @oipage/stylecss
```

安装后，引入css文件：

```js
import "@oipage/stylecss"
```

当然，也可以使用link引入：

```html
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@oipage/stylecss/src/index.css">
```

现在，就可以使用了。比如图标icon，直接：

```html
<i class="oicss-icon-love" style="--size:20px; --color: red;"></i>
```

运行结果就是：<img src="./snipping/love.png">

更多一些icon如下：

<img src="./snipping/icon.png">

是不是非常简单，你可以设置icon的大小和颜色。

更多icon和有趣有用的功能，你可以[查看文档](https://oi-contrib.github.io/oipage-stylecss/)进行了解。

## 版权

MIT License

Copyright (c) [zxl20070701](https://zxl20070701.github.io/notebook/home.html) 走一步，再走一步