# Yinaai
## | A crumb tool that can beautify your website
### | You can quote our CSS to your website ->
#### | ```<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/yinaai/yinaai.min.css">```
### | In addition to using CSS, you can also use the js way -> 
#### | ```<script src="https://cdn.jsdelivr.net/npm/yinaai/yinaai.min.js">```
## Selection guide
### If your picture is convenient, you can use JS to introduce the method
### If you use it normally, you can use the CSS introduction method
---
# Features
## 1. Pre label beautification
### Use in the website```<pre>az</pre>```You can see the beautification effect
## 2. Code label beautification
### Use in the website```<code>az</code>```You can see the beautification effect
## Web page background
### Convert your ```<html>``` tag to ```<html data-theme="wbh">``` to see the effect
## Scrollbar
### A scroll bar will be displayed when your webpage exceeds the current visibility(Directly modify the embedded style of Webkit kernel)
### Motion animation (for FontAwesome / built-in)
### On DOM load	On hover	On parent hover
 faa-wrench animated	 faa-wrench animated-hover	 faa-wrench
 faa-ring animated	 faa-ring animated-hover	 faa-ring
 faa-horizontal animated	 faa-horizontal animated-hover	 faa-horizontal
 faa-vertical animated	 faa-vertical animated-hover	 faa-vertical
 faa-flash animated	 faa-flash animated-hover	 faa-flash
 faa-bounce animated	 faa-bounce animated-hover	 faa-bounce
 faa-spin animated	 faa-spin animated-hover	 faa-spin
 faa-float animated	 faa-float animated-hover	 faa-float
 faa-pulse animated	 faa-pulse animated-hover	 faa-pulse
 faa-shake animated	 faa-shake animated-hover	 faa-shake
 faa-tada animated	 faa-tada animated-hover	 faa-tada
 faa-passing animated	 faa-passing animated-hover	 faa-passing
 faa-passing-reverse animated	 faa-passing-reverse animated-hover	 faa-passing-reverse
 faa-burst animated	 faa-burst animated-hover	 faa-burst
 faa-falling animated	 faa-falling animated-hover	 faa-falling
 faa-rising animated	 faa-rising animated-hover	 faa-rising
 ### If you want to use it, please add ```class=" the CLASS name provided above"``` to any tag
 ## Small Tag / Note Tag
 ### If you want to use Small Tag, please use ```<span class="inline-tag red">red tag</span><span class="inline-tag green">green tag</span><span class="inline-tag blue">Small blue label</span><span class="inline-tag yellow">Small yellow label</span><span class="inline-tag grey">Small gray label<span class="inline-tag grey"> /span>```Insert anywhere on your website
 ### If you want to use Note Tag, please set ```<p class='div-border green'>green</p><p class='div-border red'>red</p><p class='div -border yellow'>Yellow</p><p class='div-border grey'>Gray</p><p class='div-border blue'>Blue</p>```Insert into your website Anywhere
 ## Tip Tag
 ### Please refer to [Official Website](https://mdbf-css.js.org) But there may be some errors in the style, please ignore it, just insert it as usual
 ## Snote Tag
 ### If you want to use the Snote tag, please insert ```<div class="snote stylename">``` anywhere in your website. The stylename can enter the css internal search reference
 ---
 # Other content can be explored by yourself 
 
 
 
 
 
 
 