当前位置:首页 > 每日看点

这个用ai怎么排版出来啊?

卡卷网1年前 (2025-04-19)每日看点251

哈喽大家好!

今天给大家分享一个超实用的开发技巧——

我是怎么在15分钟内,零代码做出一个智能排版工具的

系好安全带,我们直接发车

第1步:利用mastergo设计原型

mastergo.com/

提示词

做一个网页排版工具,左侧输入原文粘贴内容,右侧展示返回排版后的内容,支持切换、移动换和页面端展示。 左侧下方一个输入框,输入密钥下方一个开始排版按钮。

这个用ai怎么排版出来啊?  第1张

1

下图可以看到

mastergo已经帮我们把原型画完啦~

这个用ai怎么排版出来啊?  第2张

2

第2步:接入DeepSeek-V3大模型

这里我们用的是硅基流动的API

01 创建key

cloud.siliconflow.cn/ac

这个用ai怎么排版出来啊?  第3张

3

02 进入模型广场

选择要接入的大模型,这里我们选择DeepSeek-V3,然后点击API文档

这个用ai怎么排版出来啊?  第4张

4

03 拼接cURL请求地址

点击Try it

这个用ai怎么排版出来啊?  第5张

5

填写刚才我们生成的API密钥

模型选择deepseek-ai/DeepSeek-V3

这个用ai怎么排版出来啊?  第6张

6

设置用户角色和提示词

并设置为流式返回及Token数量

这个用ai怎么排版出来啊?  第7张

7

点击Send,可以看到成功以流式返回了内容

表示DeepSeek-V3接入成功

这个用ai怎么排版出来啊?  第8张

8

接下来我们需要复制cURL地址

这个用ai怎么排版出来啊?  第9张

9

复制内容如下

curl --request POST \ --url https://api.siliconflow.cn/v1/chat/completions \ --header 'Authorization: Bearer sk-dwaoabysgtptzhdvjqqhduaxiofxkvqnqyfpgdwbrvhisbtm' \ --header 'Content-Type: application/json' \ --data '{ "model": "deepseek-ai/DeepSeek-V3", "stream": true, "max_tokens": 8000, "temperature": 0.7, "top_p": 0.7, "top_k": 50, "frequency_penalty": 0.5, "n": 1, "stop": [], "messages": [ { "role": "user", "content": "hello,everybody,my name is fenglm" } ] }'

第3步:准备原型图和提示词

01 原型图

这个用ai怎么排版出来啊?  第10张

10

02 提示词

##需求描述 - 制作一款AI排版助手网页,使用htm1+css - 代码实现页面样式参照图片 - 用户在左侧粘贴原文自动解析为markdown,支持上传markdown文件读取内容 - 左侧下方输入框中输入key,对应下方模型cur1中的「sk-*****]内容 - 点击开始排版后,将输入框以及用户待排版的markdown内容带入到cur1中,请求API - 流式返回内容展示在页面右侧,进行markdown渲染 ## 技术要求 - 请使用HTML、Tailwindcss和少量必要的Javascript - 引用Tailwind css(v3.0+)通过CDN - 页面需完全响应式,在移动设备和桌面端都能良好显示 ## 图标要求 - 使用Font Awesome或Material Icons等专业图标库(通过CDN引用) - 避免使用emoii作为图标替代品 ## 设计风格 - 采用圆角布局 - 主题色调使用莫兰迪色系,避免强烈的视觉刺激,淡雅高级 - 增加留白、毛玻璃、半透明设计元素 ## 模型调用 curl --request POST \--url https://api.siliconflow.cn/v1/chat/completions \--header 'Authorization: Bearer sk-dwaoabysgtptzhdvjqqhduaxiofxkvqnqyfpgdwbrvhisbtm' \--header 'Content-Type: application/json' \--data '{ "model": "deepseek-ai/DeepSeek-V3", "stream": true, "max_tokens": 8000, "temperature": 0.7, "top_p": 0.7, "top_k": 50, "frequency_penalty": 0.5, "n": 1, "stop": [], "messages": [ { "role": "user", "content": "你是一名专业的文字排版大师。请按照以下排版规范,重新排版我提供的文本内容,输出为markdown格式: 1.数字、英文与汉字之间空一格,如:今天是 2025年 04 月 15 日 2.高信息价值的金句,使用加粗格式 3.使用中文引号「」代替英文引号"" 4.段落控制在200字以内,超出字数分段,段落间空行 5. 标题与标题之间,标题与正文之间均空一行 6. 标题层级格式[注意标题需要使用markdown格式分级,例如一级标题为# 一、」: - 一级标题: 一、二、三、 - 二级标题: 一) 二) 三) - 三级标题: 1、2、3、 - 四级标题: 1) 2) 3) 7.仅输出排版后的内容,仅做排版,不修改原文的具体内容 请帮我重新排版以下文本,使其符合上述规范: [用户需要调整格式的内容]", "role":"user } ] }'

第4步:开始使用Cursor开发

我们将原型图和提示词一并发给Cursor

Cursor会帮我们实现一版效果

01 实现过程

这个用ai怎么排版出来啊?  第11张

11

这个用ai怎么排版出来啊?  第12张

12

02 实现效果

这个用ai怎么排版出来啊?  第13张

13

我们准备一个markdown文件

可以看到内容是没有经过排版的

这个用ai怎么排版出来啊?  第14张

14

上传md文件

开始排版

这个用ai怎么排版出来啊?  第15张

15

03 排版效果

这个用ai怎么排版出来啊?  第16张

16


搞定!是不是比想象中简单?

如果你按这个教程做出了自己的排版助手

欢迎在评论区晒图

(说不定你的版本比我的更强呢✨)

如果觉得有用,记得:

点赞让更多人看到

⭐ 收藏下次跟着做不迷路

关注解锁更多AI开发小技巧

扫描二维码推送至手机访问。

版权声明:本文由卡卷网发布,如需转载请注明出处。

本文链接:https://www.kajuan.net/ttnews/2025/04/12702.html

分享给朋友:

相关文章

每天5点就下班了,闲着也是闲着,有哪些副业可以推荐?

每天5点就下班了,闲着也是闲着,有哪些副业可以推荐?

今天整理了36个搞钱APP 可以先接触学习看看,然后选定一个感兴趣的方向去精进 要知道机会不是一下子来临的, 而一定是你前期做了很多准备 每天进步一点点,就像滚雪球一样 希望所以女生,能够在2024年提升自己, 立下一个新的搞钱Flag吧…

请问什么软件支持看电视直播?

请问什么软件支持看电视直播?

2024年9月6日最新更新:本文列举的 所有看电视直播、或流媒体影视资源点播的软件,我这两天又重新梳理成最新版本,最大程度保证可用性。获取方式见文末图片,或见评论。后续我也将持续更新,文章是旧的软件也会是新的,保证你拿到的都是最新可用版本。…

电视上哪个软件可以免费看电视直播?

电视上哪个软件可以免费看电视直播?

今天给大家推荐8款免费电视端直播看剧软件,感兴趣的朋友可以下载试一试! 1、超级ITV 6.04免费看电视直播,央视卫视高清秒播,还有电影电视剧少儿体育等。 2、小鲸电视 1.3.1小鲸电视是一款智能电视应用,集成了多个内容来源,包括腾讯视…

k70和红米note14pro+咋选啊?

k70和红米note14pro+咋选啊?

首选红米K70,可满足题主的功能需求。 红米 Note 14 pro+的使用者定位并不是学生,红米K70的使用者定位才是学生。 一、k70和红米note14pro+各自的参数 红米K70推出的定位初衷,是主打性能为主。最佳使用对象是喜欢…

内存和硬盘的单位都是G,两者的功能是什么?谁能用简单通俗的方式来解读一下?

内存和硬盘的单位都是G,两者的功能是什么?谁能用简单通俗的方式来解读一下?

要弄清楚这个问题,首先要弄清楚什么是内存,什么是硬盘,在计算机的组成结构中有一个很重要的部分是存储器。它是用来存储程序和数据的部件。对于计算机来说,有了存储器,才有记忆功能,,才能保证正常工作。存储器的种类很多。按其用途可分为主存储器与辅助…

NAS那么好,为什么还是没能成为大多数家庭必备的存储设备?

NAS那么好,为什么还是没能成为大多数家庭必备的存储设备?

最主要原因是因为——贵! 看看我家里搭建的这一套吧。 目前我家中有5台常用的NAS,分别为群晖DS1522+、威联通TS-464C2、绿联DX4600 Pro 、极空间Z4S、威联通TS-AI642。个人认为,这其中的每台NAS都是时代…

发表评论

访客

看不清,换一张

◎欢迎参与讨论,请在这里发表您的看法和观点。