slidev
发表于|更新于
|浏览量:
君子先择而后交,小人先交而后择。——王通
分享一个为开发者打造的演示文稿工具:https://cn.sli.dev/

Slidev (slide + dev,
/slʌɪdɪv/) 是基于 Web 的幻灯片制作和演示工具。它旨在让开发者专注在 Markdown 中编写内容,同时拥有支持 HTML 和 Vue 组件的能力,并且能够呈现像素级完美的布局,还在你的演讲稿中内置了互动的演示样例。它使用了功能丰富的 markdown 文件来生成精美的幻灯片,具有即时重载的体验。它还拥有很多内置的集成功能,如实时编码、导出 PDF、演讲录制等。由于 Slidev 是由 web 驱动的,因此你可以使用它进行任何操作 —— 具有无限的可能性。
你可以在 为什么选 Slidev 部分了解更多关于本项目的设计初衷。

相关推荐
2024-12-09
spark-joy
死非生的对立面,而作为生的一部分永存。——《挪威的森林》 ✨😂 2000 多种方法为您的产品增添设计风格、用户满意度和奇思妙想。 https://github.com/swyxio/spark-joy/ 为您的产品添加设计风格、用户满意度和奇思妙想的简单方法! Spark Joy 理念在我的书中有更详细的解释(https://learninpublic.org/),如果您想探索这种方法如何应用于设计实用程序之外的其他领域,请查看它。 目录 [4 分钟网页设计](#4 分钟网页设计) CSS/UI 模板 严肃的 CSS 框架 插入 CSS 框架 有趣的 CSS 框架 无框架 CSS 重置 CSS A11y 跳棋 Tailwind 组件库 React 组件库 布局 堆叠和高程 二维间距 响应式布局断点 布局出血 其他布局工具和技巧 版式 字体 行高 线宽 字距调整和字符间距 字体大小 版式讲座 其他版式资源 颜色 调色板生成器 颜色渐变 色彩理论 数据可视化的色彩理论 背景 背景渐变和图案 背景插图 背景 SVG 纹理 杂项...
2024-07-03
js页面历史返回
历史是一堆灰烬,但灰烬深处有余温。——黑格尔 我们可以使用history.back()来进行页面返回 history的文档: History API - Web API | MDN 除了返回还可以前进 1history.forward(); 以及 12// 向后跳转一个页面(等价于调用 back())history.go(-1); 然后还有 12// 向前跳转一个页面,就像调用 forward()history.go(1); 当然传入0就是刷新 123// 以下语句都具有刷新页面的效果history.go(0);history.go(); 还有查看页面栈长度 1const numberOfEntries = history.length; 补充: 12345678910window.addEventListener("popstate", (event) => { alert(`位置:${document.location},状态:${JSON.stringify(event.state)}...
2025-07-31
NotionNext
世间的很多事物,追求时候的兴致总是要比享用的时候的兴致浓烈。——莎士比亚《威尼斯商人》 https://github.com/tangly1024/NotionNext NotionNext:让你的 Notion 笔记一键变身高颜值博客,创作力爆表!你是否曾梦想过,把平时在 Notion 里整理的笔记、知识库、项目规划,轻松变成一个公开的、高颜值的个人博客?不用折腾服务器、不用敲一行后端代码,只需几步就能让你的内容“闪耀网络”!NotionNext,就是这样一款为创作者量身定制的“神器”,让你的 Notion 内容即刻升级为一个全功能网站! NotionNext 是什么?NotionNext 是一个基于 NextJS 和 Notion API 开发的静态博客系统。它专为 Notion 用户和内容创作者而生,让你可以把自己的 Notion 页面一键部署到 Vercel,秒变个人博客、知识库、作品集,甚至是团队官网! 官网/文档:NotionNext帮助手册 项目地址:tangly1024/NotionNext 主要特性亮点 无缝对接 Notion:只...
2025-02-17
animejs示例
读书使人充实,思考使人深邃,交谈使人清醒。——富兰克林 https://codepen.io/collection/XLebem/ 这里有anime.js实现的不少案例 例如移动端的卡片弹出动画实现: https://codepen.io/aryankap/pen/poERmEM 带进度条的提交按钮: https://codepen.io/andrewmillen/pen/MoKLob 带动画的小图标: https://codepen.io/nat-davydova/details/dyorEMm 夜间模式切换按钮: https://codepen.io/borntofrappe/details/aboPapm 等等
2021-06-02
关于wx.getUserInfo获取到匿名数据的坑
生命的黎明是乐园,青春才是真正的天堂。——华兹华斯 今天搞了很久,发现使用wx.getUserInfo获取到的用户昵称一直是:“微信用户”,并且头像也是默认的。。。 然后官方文档里发现 https://developers.weixin.qq.com/miniprogram/dev/api/open-api/user-info/wx.getUserInfo.html 打开后是这个页面 然后我们看wx.getUserProfile的文档: wx.getUserProfile只能在页面产生点击事件(例如 button 上 bindtap 的回调中)后才可调用每次请求都会弹出授权窗口,用户同意后返回 userInfo。该接口用于替换 wx.getUserInfo,详见 用户信息接口调整说明。 注意desc是必填 我们配置好appid后 调用wx.getUserProfile 代码如下 12345678910111213141516171819202122232425262728<template> <view style="width:1...
2021-08-06
代码方式引入iconfont图标
只有永远躺在泥坑里的人,才不会再掉进坑里。——黑格尔 前端开发中,经常会遇到需要引用图标的情况 我们可以在iconfont寻找我们需要的图标 https://www.iconfont.cn/ 比如这两个图标,我非常喜欢,我可以使用直接下载的方式引入图标 但这种方式,如果我们需要它改变颜色的话,就需要再次下载,非常麻烦 我们还可以使用代码方式引入,我们首先点击添加进购物车 然后到我们的购物车结算 点击添加至项目 登录账号 然后再次点击添加至项目后会弹出加入项目,我们可以新建一个项目 确定后,我们就可以在这里点击生成代码 然后复制代码 粘贴到项目css中 然后定义使用iconfont的样式 123456.iconfont{ font-family:"iconfont" !important; font-size:16px;font-style:normal; -webkit-font-smoothing: antialiased; -webkit-text-stroke-width: 0.2px; -m...

阿超
我的名字叫阿超 年龄25岁 家在北京市 职业是软件开发 每天最晚也会在八点前回家 不抽烟 酒浅尝辄止 晚上十二点上床 保证睡足八个小时 睡前写一篇博客 再做二十分钟俯卧撑暖身 然后再睡觉 基本能熟睡到天亮 像婴儿一样不留下任何疲劳和压力 就这样迎来第二天的早晨 健康检查结果也显示我很正常 我想说明我是一个不论何时都追求内心平稳的人 不拘泥于胜负 不纠结于烦恼 不树立使我夜不能寐的敌人 这就是我在这社会的生活态度
Follow Me公告
This is my Blog