# x-jss
**Repository Path**: weexi/x-jss
## Basic Information
- **Project Name**: x-jss
- **Description**: 【原创】利用JavaScript写CSS吧！
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No
## Statistics
- **Stars**: 1
- **Forks**: 0
- **Created**: 2019-04-12
- **Last Updated**: 2020-12-19
## Categories & Tags
**Categories**: Uncategorized
**Tags**: None
## README
# JStylesheet
#### 介绍
【原创】利用JavaScript写CSS吧！
**使用**
```javascript
var JSS = require("jstylesheet");
var style = new JSS({
body: {
margin: 0,
padding: 0,
div: {
fontSize: "10px",
"&.top-div": {
color: 'red'
},
"&.bottom-div": {
color: "blue"
},
"&:first-child": {
fontSize: "12px"
},
"&:last-child": {
fontSize: "14px"
},
"&:not(:first-child)":{
textAlgin: "right"
},
$hover: {
boxShadow: "0 0 10px #eee"
},
span: {
color: 'yellow'
}
}
}
}).compile();
```
```javascript
// 自动添加到元素内
style.append()
```
**在浏览器中使用**
```html
```
// 生成CSS ==>
```html
body { margin: 0; padding: 0 }
body div { font-size: 10px }
body div.top-div { color: 'red' }
body div.bottom-div { color: 'blue' }
body div:first-child { font-size: '12px' }
body div:last-child { font-size: '14px' }
body div:not(:first-child) { text-align: 'right' }
body div:hover { boxShadow: "0 0 10px #eee" }
body div span { color: 'yellow' }
```