5分钟上手HTML-Sheets-of-Paper：打造专业级在线文档的终极教程

5分钟上手HTML-Sheets-of-Paper：打造专业级在线文档的终极教程

【免费下载链接】HTML-Sheets-of-PaperWord processor in your browser using HTML and CSS (for invoices, legal notices, etc.)项目地址: https://gitcode.com/gh_mirrors/ht/HTML-Sheets-of-Paper

HTML-Sheets-of-Paper是一款基于HTML和CSS的浏览器端文字处理工具，让你无需安装复杂软件就能创建专业文档，如发票、法律通知等。这款轻量级工具就像简化版的在线Word，通过网页浏览器即可实现文档编辑与排版，是快速制作专业文档的理想选择。

🌟 为什么选择HTML-Sheets-of-Paper？

这款工具的核心优势在于简单易用和高度兼容性：

• 无需安装任何软件，直接在浏览器中运行
• 支持多种标准纸张尺寸，满足不同场景需求
• 生成的文档可直接打印或导出为PDF
• 兼容主流浏览器，包括Chrome、Firefox、Safari等

📋 快速开始：5分钟安装指南

1️⃣ 获取项目文件

首先克隆仓库到本地：

git clone https://gitcode.com/gh_mirrors/ht/HTML-Sheets-of-Paper

2️⃣ 启动应用

进入项目目录，直接在浏览器中打开index.html文件即可开始使用。无需复杂配置，立即进入编辑界面。

📄 支持的纸张尺寸

HTML-Sheets-of-Paper提供多种标准纸张尺寸，位于css/目录下：

• A4(21cm × 29.7cm) —sheets-of-paper-a4.css
• A3(29.7cm × 42cm) —sheets-of-paper-a3.css
• US Letter(21.6cm × 27.9cm) —sheets-of-paper-usletter.css
• US Legal(21.6cm × 35.6cm) —sheets-of-paper-uslegal.css
• US Tabloid(27.9cm × 43.2cm) —sheets-of-paper-ustabloid.css

要切换纸张尺寸，只需修改index.html中第13行的CSS引用：

<link rel="stylesheet" type="text/css" href="css/sheets-of-paper-a4.css">

📝 基本编辑技巧

添加新页面

每个页面由<div class="page">元素定义，在index.html中添加新的页面区块即可：

<div class="page" contenteditable="true"> <!-- 新页面内容 --> </div>

手动分页

需要强制分页时，使用页面分隔符：

<div class="page-break" contenteditable="false"></div>

🔄 横向排版设置

如需使用横向排版，只需简单修改两个地方：

1. 在使用的CSS文件中（如sheets-of-paper-a4.css）：

   • 交换width和min-height的值
   • 将size属性的第二个值设为landscape

2. 在index.html中，更新Config.pageHeightInCentimeter的值为新的min-height

🖨️ 打印与导出PDF

Chrome浏览器最佳设置

1. 打开打印对话框（Ctrl+P或Cmd+P）
2. 目标选择"另存为PDF"
3. 纸张尺寸选择与CSS中定义的尺寸一致
4. 边距选择"无"
5. 取消勾选"页眉和页脚"
6. 勾选"背景图形"

📌 浏览器兼容性

HTML-Sheets-of-Paper支持多种现代浏览器：

• Chrome 4+
• Firefox 19+
• Safari 5+
• Opera 10.1+
• Internet Explorer 9+
• Edge 12+

🎯 适用场景

这款工具特别适合以下场景：

• 快速创建发票和收据
• 生成法律文档和合同
• 制作简单的报告和备忘录
• 离线文档编辑

只需5分钟，你就能开始使用HTML-Sheets-of-Paper创建专业文档。无论是个人使用还是小型团队协作，这款轻量级工具都能满足你的基本文档编辑需求，让你摆脱对重量级办公软件的依赖。

【免费下载链接】HTML-Sheets-of-PaperWord processor in your browser using HTML and CSS (for invoices, legal notices, etc.)项目地址: https://gitcode.com/gh_mirrors/ht/HTML-Sheets-of-Paper