Paper CSS 使用教程

1. 项目的目录结构及介绍

Paper CSS 项目的目录结构如下：

paper-css/
├── examples/
│   └── images/
├── test/
├── .gitignore
├── LICENSE
├── README.md
├── package-lock.json
├── package.json
├── paper.css
└── paper.min.css

目录介绍

• examples/: 包含一些示例文件和图片。
• test/: 包含测试文件。
• .gitignore: Git 忽略文件设置。
• LICENSE: 项目许可证文件。
• README.md: 项目说明文档。
• package-lock.json: npm 依赖锁定文件。
• package.json: 项目设置文件，包含依赖和脚本。
• paper.css: 编译后的 CSS 文件。
• paper.min.css: 编译后的压缩 CSS 文件。

2. 项目的启动文件介绍

Paper CSS 的启动文件主要是 paper.css 和 paper.min.css。这两个文件是编译后的 CSS 文件，可以直接在 HTML 文件中引用。

引用方式

<link rel="stylesheet" href="path/to/paper.css">

或者使用压缩版本：

<link rel="stylesheet" href="path/to/paper.min.css">

3. 项目的设置文件介绍

Paper CSS 的设置文件主要是 package.json。这个文件包含了项目的元数据和依赖信息。

package.json 内容示例

{
  "name": "paper-css",
  "version": "0.3.0",
  "description": "Paper CSS for happy printing",
  "main": "paper.css",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "repository": {
    "type": "git",
    "url": "git+https://github.com/cognitom/paper-css.git"
  },
  "keywords": [
    "css",
    "print",
    "paper"
  ],
  "author": "cognitom",
  "license": "MIT",
  "bugs": {
    "url": "https://github.com/cognitom/paper-css/issues"
  },
  "homepage": "https://github.com/cognitom/paper-css#readme"
}

设置文件介绍

• name: 项目名称。
• version: 项目版本。
• description: 项目描述。
• main: 主文件路径。
• scripts: 脚本命令。
• repository: 代码仓库信息。
• keywords: 项目关键词。
• author: 作者信息。
• license: 许可证类型。
• bugs: 问题追踪地址。
• homepage: 项目主页。

以上是 Paper CSS 项目的目录结构、启动文件和设置文件的介绍。希望这份教程能帮助你更好地理解和使用 Paper CSS。