介绍
SimpleWords是一个HTML幻灯片生成工具,你只需要按照格式把幻灯片写在文本文档里,就可以轻松生成一个HTML幻灯片(使用浏览器打开)。SimpleWords支持Markdown和HTML标签,可以设置背景颜色。支持两种样式:
- pure:它适用于制作简单的概括性的幻灯片:每页只有少量的文字或关键词;每页只放一张图片,或是一个视频。这种样式没有页面边框,文字和元素将居中显示。
- rich:适合更复杂的页面布局。有页面边框,文字和元素靠左对齐。
Github地址:https://github.com/greyli/SimpleWords
用法
设置样式
在文档第一行设置页面的样式,默认为pure样式。在两个百分号后面写上样式名称(pure或rich),独占一行,小写:
%%pure
或
%%rich
设置背景颜色或图片
在文档的最后一行设置背景颜色,默认为灰色。在两个美元符号后接上你要设置的颜色,RGB值,如下所示:
$$red
或
$$rgb(123, 45, 45)
需要注意的是,所有的字符都要是英文半角字符。所以不应该出现¥¥或是()。
文件结构
SimpleWords\
– js\
– css\
– images\
– videos\
– words.txt
– slide.py
– slide.html
- 根目录下的words.txt是你写幻灯片的地方。
- 你要插入的图片和视频要分别放在images和videos文件夹内。
- slides!.py是生成你的幻灯片的程序。
- slides.html是你的幻灯片,点击它就可以打开你的幻灯片了。
幻灯片分隔符
每一张幻灯片的分隔方式有两种:第一种,使用独占一行的五个横线分隔“—–”;第二种,使用换行符作为分隔,即一行代表一张幻灯片。两种分隔方式不可混用。当没有发现横线换行符时,采用默认的行分隔。
注意:设置样式和背景颜色的语句同样需要使用分隔符!
文字效果
支持Markdown和HTML两种标记语言(可以混用),所以你可以方便的为你的幻灯片实现你想要的效果。比如下面是一些常用的Markdown标签:
# 这是H1 ## 这是H2 ### 这是H3 这是一个段落。 *这是斜体* **这是粗体** ***这是粗体+斜体*** 一段文字后打上两个空格表示另起一行
了解更多有关HTML和Markdown的信息:MDN HTML文档、Markdown
添加图片和视频
图片:
![alt text](images/photo.jpg)
或
<img src="images/photo.jpg" height="600">
视频:
<video width="800" height="600" controls><source src="videos/movie.mp4"></video>
注意:当使用行分隔时,不要让标签分行。建议不要让height值超过600。
版权声明
SimpleWords基于简化了的impress.js生成。