佬们是如何优雅地截取网页ui的

想截取网页ui放到项目ppt里

看你是想方移动端还是 pc 端,记得有个套着手机壳的样式截图的软件

F12 → Ctrl +Shift +P→ 输入screen →按需求截取

1 Like

Selenium 很容易

F12扑获屏幕节点截图

又学到了新知识!

26 Likes

杀鸡焉用牛刀 :sweat_smile:

截取UI是指的截图吗?
做 ppt 要是想要嵌入UI,可以嵌入Vue 代码,看看这个项目 slidev

功能

  • :memo: Markdown 支持 —— 使用你最喜欢的编辑器和工作流编写 Markdown 文件
  • :technologist: 开发者友好 —— 内置代码高亮、实时编码等功能
  • :artist_palette: 可定制主题 —— 以 npm 包的形式共享、使用主题
  • :rainbow: 灵活样式 —— 使用 Windi CSS 按需使用的实用类和易用的内嵌样式表
  • :person_juggling: 可交互 —— 无缝嵌入 Vue 组件
  • :studio_microphone: 演讲者模式 —— 可以使用另一个窗口,甚至是你的手机来控制幻灯片
  • :artist_palette: 绘图 - 在你的幻灯片上进行绘图和批注
  • :abacus: LaTeX 支持 —— 内置了对 LaTeX 数学公示的支持
  • :newspaper: 图表支持 —— 使用文本描述语言创建图表
  • :glowing_star: 图标 —— 能够直接从任意图标库中获取图标
  • :laptop: 编辑器 —— 集成的编辑器,或者使用 VS Code 扩展
  • :movie_camera: 演讲录制 —— 内置录制功能和摄像头视图
  • :outbox_tray: 跨平台 —— 能够导出 PDF、PNG 文件,甚至是一个可以托管的单页应用
  • :high_voltage: 快速 —— 基于 Vite 的即时重载
  • :hammer_and_wrench: 可配置 —— 支持使用 Vite 插件、Vue 组件以及任何的 npm 包

示例

官网

1 Like

From #develop:qa to 开发调优

1 Like