青山遮不住,畢竟東流去
这里我们可以要求 Claude 用 CDN 引用 TailwindCSS 来写组件样式,Tailwind CSS 封装了一套非常美观和简洁的样式,可以让 Claude 直接调用,确保在色彩、响应式和基础组件的美观度不出大问题。

🌟提示词:

方括号[]的部分就是你需要填写的部分。

我需要创建一个[具体描述你的页面/组件类型],请帮我生成美观且响应式的HTML+CSS代码。

## 设计参考
我希望设计风格类似于以下参考:
[上传参考图片或描述设计灵感来源]

## 技术要求
- 请使用HTML、TailwindCSS和少量必要的JavaScript
- 引用Tailwind CSS(v3.0+)通过CDN
- 页面需完全响应式,在移动设备和桌面端都能良好显示

## 图片资源
- 请使用Unsplash API提供的图片作为内容图片
- 根据内容主题选择合适的关键词

## 图标要求
- 使用Font Awesome或Material Icons等专业图标库 (通过CDN引用)
- 避免使用emoji作为图标替代品

## 交互细节
[描述任何需要的交互动画或效果,例如:]
- 按钮悬停时有轻微放大效果
- 表单输入框聚焦时显示渐变边框
- 卡片在悬停时有阴影加深效果

## 特别注意
- 确保代码干净且有适当注释
- 提供完整可运行的HTML文件,包含所有必要引用
- 优化视觉层次和间距,确保设计美观专业

5️⃣如何生成设计稿:

昨天群里一个朋友提了一嘴能不能转设计稿想了一下,居然还真可以,而且可以帮你生成带自动布局的 Figma 设计稿和对应可复用的组件。具体的方法也很简单

只需要将你生成的代码部署到线上,如果你用 Claude 或者 POE 都有这个功能,如果你用的软件没有发布能力的话可以用这个 http://yourware.so 产品。

获得了线上的链接之后,我们只需要使用 http://html.to.design 这个 Figma 插件就可以很好的将网页转换为
最近很多人问我,为啥我用 Claude 写的应用就没那么漂亮?

所以教大家一些非常简单的技巧,用上了以后你也能搞定这么漂亮的界面

👇下面是具体的技巧和完整提示词

完整内容这里:https://mp.weixin.qq.com/s/tUOAfd4OI56QxD94-0PPKw

1️⃣第一个技巧:

不用非得用语言来描述你想要的界面样式,可以去一些设计平台找一些你喜欢的设计稿将图片上传到图片让模型参考。

如果你不知道去哪找的话,国内推荐站酷、海外的话推荐 Dribbble 和 Layers。

在跟 Claude 说的时候就可以忽略那些不好描述的地方,重点描述静态图片无法表现的部分,比如下面的这个卡片组件。

我就让 Claude 注意交互的动画和输入框聚焦之后的渐变动画上,界面内容和风格就让他按图片生成。

2️⃣第二个技巧:

在让 Claude 生成界面的时候,你会发现 Claude 生成的页面没有图片,本来应该是图片的部分经常是空白的,这个就很影响结果的视觉表现。

其实我们可以要求他引用一些在线的图片来填充到页面需要图片的部分。

这里首先推荐 unsplash,他是一个开源图片网站,里面有世界各地的设计大神上传的图片,而且可以直接引用。

可以看下面加上图片之后的卡片是不是就好看很多了。

3️⃣第三个技巧:

另外 claude 在生成页面的时候本来应该是图标的地方,他喜欢用 emoji 来代替,emoji 也很好,但是在一些严肃的页面上就会显得格格不入。

这里可以要求 Claude 在生成页面的时候引用在线的图标库,比如Font Awesome或Material Icons,这些开源图标库可以通过 CDN 直接引用,而且不需要部署。

可以看到引用了 Font Awesome 图标库的图标之后我们的界面变得更加简洁和整齐。

4️⃣第四个技巧:

我们常用的前端样式代码是用 CSS 写的,但是 CSS 本身的一些样式其实没有太考虑美观度的要求。

这就导致你让 Claude 写样式的时候他就会过渡自己发挥,美观度也就没办法得到保障,而且你对样式要求多之后他要从头写的 CSS 也就越多浪费很多 Token。
#Life #Article #Chrome

⌨️光标迷之移动的从排查到解决

🦠 症状

最近经常会遇到一个很迷的情况,具体的问题是当我使用 macOS 打开浏览器,在一些需要输入文字的文本框输入时,光标总会自动跳到文本框首字处。如果是从零开始的空白编辑倒也还好,但我经常会编辑文本框中已经有文字的内容。我不能从我选中的地方开始写,每次定位光标之后,光标都会跳到内容首字处,重复做3、4次之后才能消失。

💉 问题排查

排查思路:首先我发现这个情况只发生于浏览器页面中的文本输入框,那么影响到这个层面的因素应该有【输入法】、【浏览器】、【其他全局软件】这几个因素,需要逐一排查。

1. 输入法

其实我最怀疑的就是输入法,因为我这段时间一直在使用微信输入法。所以,我在系统设置里先禁用了微信输入法(并不是卸载),然后添加了系统默认的简体中文输入法。问题依旧没有解决,所以,问题大概不出在输入法上。

2. 浏览器

首先我是用的 Arc 浏览器,我换成了 Safari 。测试后发现同一个页面的文本输入框在 Safari 中完全不会出现这个问题。如果是浏览器外的系统级别【全局软件】应该不会在 Safari 上不起效,因此,初步断定是在 Arc 浏览器中有问题。

但是我早在一年前使用 Arc 浏览器的时候貌似还没有这么难缠的问题,我又开始怀疑是不是我浏览器中的扩展程序引起了这个问题。逐一将扩展程序关闭后尝试刷新带有文字输入框的网页,大概持续了10分钟,排查到了一个叫做「简体繁体拼音广东话转换 Simplified/Traditional Chinese」的扩展程序,在关闭它后,问题得以解决。

3. 其他全局软件

其实排查到第二步就已经解决问题了,假设没有解决,也就是浏览器不是诱因,来到第三步我先预设一下我会如何做。这里就需要排查一下浏览器之外的软件,这种软件通常还要对浏览网页或者鼠标和键盘输入有一定辅助的软件,不然也不会影响网页文本框的光标了,想到这里我能联想到的无非就是广告拦截软件、截图/录屏软件、可以向浏览器页面注入和修改 JS/CSS 代码的软件(如 Userscripts 和 Stylish 这类软件)、密码管理软件等。

🔚 小结

其实这个问题已经困扰我最少 3 个月的时间了,甚至可能更长,因为我之前并没有频繁的在网页中进行写作。一开始我其实是比较想要摆烂的,不想要兴师动众的去排查,甚至寄希望于世哪些软件的 Bug,等他们自己升级后解决。但是终于在最近我有点受不了了,还是需要自己行动起来才能解决问题。希望这个可以帮到有同样问题的朋友,或者排查问题的思路可以让部分朋友受益。
#每周一书

《方糖 AI 自编程入门》,这本书是作者结合实践经验编写的 AI 自编程入门教程,旨在帮助非程序员也能借助 AI 开发出功能复杂、质量过硬的程序,而不仅仅局限于贪吃蛇这样的玩具。

争取早日上架自己的 iOS App 😅
ai-self-coding-book-v1.0.pdf
19.6 MB
#tools #PKM 欧路词典出品[欧路翻译](https://www.eudic.net/v4/en/app/plugins)属于【网页划词翻译工具】,支持Chrome、Edge和Firefox浏览器扩展。不仅支持网页和 PDF 等文档翻译,还支持划词搜索、重点单词高亮、上下文语境分析、沉浸式翻译、视频字幕翻译等功能,且支持自定义第三方AI大语言模型。

特色及实用功能非常多,很不错,也有自带的欧路AI,但不知道用的哪家接口,并有【翻译风格】和【术语库】功能。

如果你在其他端也用欧路词典,推荐用这个。如果没用过,也推荐,比以前沉浸式翻译好很多,对于需要掌握外语学习,非常好。

而且从翻译类型来讲,有口语化的、书面化的、学术翻译的、文学翻译的和意译专家。
卡介苗的诞生

十九世纪末期,许多学者试图用结核菌制成疫苗为人接种,以预防结核病(痨病)。

但是制取的疫苗,要么对实验动物无效,要么带有较大毒性导致动物死亡。

1907年,法国巴斯德研究所的两位科学家卡尔梅特与介朗从一头患结核病的牛身上分离出了一株牛型结核菌,在马铃薯-甘油培养基中,加入小牛胆汁,每三周传代一次,发现该结核菌的毒力逐渐减弱。经过13年间230次连续传代分离,终于培养出了不致病但仍保留免疫原性的疫苗。

1924年,他们两人正式公开了这项发明。

为了纪念两位科学家,这种减毒活疫苗就被命名为“卡介苗”。
#Life #Music #Video

🎵 周一了,需要办公的沉浸 BGM 么?

🍎 Apple TV 大火的《人生切割术》剧集以其精妙的剧情设计闻名,其实剧中的 OST 也很经典。

🎶 这则视频就是 ODESZA 重新将 《人生切割术》中的原声音乐进行了重新编曲,制作成了一个适合长时间沉浸式收听的版本。本身单个音频有 32 分钟,这则 Youtube 视频则将其多次循环,长达 8 小时。时长非常满足打工人

📺 点击前往收听
2025 年专注在 Grass 这个 AI 项目上大概率是稳赢的,分析如下:

1、在浏览器插件挂机之后,2025 年 Q1 计划推出 iOS 应用,数据采集的场景更加广泛。

2、AI 大模型的护城河目前来看不是算力和算法(看 grok 就知道了,大力出奇迹),真正构成护城河的是数据,依托 grass 构建的去中心化的数据采集体系,会有众多买家。它是人类分布式资源与 AI 时代需求的接口。它不仅将闲置带宽货币化,更通过去中心化网络重新定义了数据的“所有权”。

3、预计年内推出第二轮空投,$grass 看高至 5 美金。

4、可在官方质押池稳定获得 38.12% 的年化收益,可逢低价(低于1.5)囤币并质押。


参与方式:

1、打开 grass 官网注册帐号,然后安装 Grass Extension 浏览器插件或者安装

2、在插件界面登录之前注册的邮箱账号,显示「Connected」时表示连接成功,保持 wifi 连接状态,就可以持续产生 Grass 积分。需要注意的是,需要关闭 VPN 才能产生积分,用户的积分机制并不固定,受 IP 所处的地理位置和网络环境影响。

3、如果你有多个独立 ip 可以加快积分获取速度,会多一些空投。🌚
#Web #Music #Download

🎺 Jpop80ss:也许是最完整的 70-90 年代日本歌曲库

🔗 Jpop80ss2 | Jpop80ss3

📀 不知道大家平常主要通过哪些途径收听音乐?对我来说,尽管已经订阅了 Spotify、TIDAL 等多个音乐串流平台,但当涉及到上世纪的一些冷门唱片时,往往只能通过 YouTube 来找寻所需。事实上,我也一直抱着「通过 Bandcamp 发现新声、通过 YouTube 挖掘旧歌」的想法——凭借着无数爱好者的转录分享,YouTube 或许是歌曲资源最为丰富、对乐迷群体最为友好的平台之一。

📺 但在 YouTube 上听歌也存在许多瑕疵。由于 YouTube 上的资源多为实体唱片的转录,对于习惯按单曲而非专辑单位听歌的用户而言,收听起来略显繁琐;尤其是在没有提供曲目切分的情况下,让使用 Last.fm 等服务来追踪听歌记录的用户更是不便;更别提由于平台转码而导致的音频信息损耗等问题。正是因为以上种种问题,对于在正规串流平台上没有版权、同时实体唱片不易取得的作品,我现在更习惯下载音源后在本地收听。

🎵 今天向大家分享一个我收藏已久的博客——Jpop80ss。顾名思义,这是一个专注于分享八〇年代 J-pop 歌曲的网站,从二〇一一创站以来一直作为个人项目运作,至今已收集了数以万计的歌曲资源,所涉及范围也从日语逐渐拓展到华语、马来西亚、菲律宾等其他亚洲地区。

🫶🏻 Jpop80ss 上的音频资源大部分都提供 MP3 及 Flac 格式,支持通过 Google Drive、MediaFire、MEGA 等网盘免费下载。博客作者设置了「每月捐赠目标($50)」的支持方案,如果大家喜欢 Jpop80ss,也欢迎用自己的方式来支持 Ta。

📍 首发频道小红书Twitter即刻

频道:@NewlearnerChannel
什么?Perplexity 自己搞了个浏览器?!Comet 用 Agentic Search 驱动,不像一般搜寻丢一堆书叫你‘自己找’,它更像个超会查资料的朋友,直接帮你整理好答案。

想试试?赶快加入等待名单

perplexity.ai/comet Comet Browser: a Personal AI Assistant
未来面试,如果简历留了 GitHub 直接用这个项目查一下,真的太好用了
https://github-contrib-stats.vercel.app/
#GitHub情报 #macOS #tvOS

🖥 snoopy:在 macOS 中使用史努比屏保

🔗GitHub | Download | V2EX

好久没有写分享类的稿子了,正好近期清一清年前留下来的库存。今天和大家分享的是如何从 tvOS 提取史努比屏保,并在 macOS 中使用

🧠 原理

Reddit 的这个帖子中,有详细的说明,而 V2EX 的小伙伴根据其中的步骤为我们提取好了对应的屏保文件。具体来讲,操作如下:

① 在 macOS 中下载 Xcode
② 新建 tvOS 工程模拟
③ 将 tvOS 系统中的史努比屏保相关视频文件拷贝至 macOS
④ 下载屏保程序 Aerial 并制作对应的屏保文件

你可以根据上述步骤,去制作自己的史努比屏保。实际上,这已经不是 Aerial 屏保第一次大放异彩,若干年前就有好事者将 tvOS 中的金门大桥等屏保通过这样的方式移植到 macOS

🧑🏻‍💻 如何使用

由于作者已经为我们打包好了 snoopy.saver,我们双击在系统设置中进行安装,即可将其设置为默认系统屏保

由于我使用的是 macOS 13,一切都很顺利,如果你使用较新的 macOS 系统并遇到了安装问题,可以前往 V2EX 或 GitHub 留言反馈

👀 2023 年 9 月,随着 Apple WatchOS 10 的正式上线,「史努比表盘」也正式走入大众视野。一百多段变化的场景和片段,让我们大为惊喜:他们与表针互动玩耍、对天气情况与假期节日做出反馈,甚至会在用户锻炼时活动起来,在用户手腕下垂、表盘熄屏时安静休息

🎉 而去年 tvOS 18.2 的正式发布,将这一为人称道的屏保带入了 tvOS,我们能够在更大的屏幕上看到史努比和他的伙伴们。如今,经过国内外爱好者的不断研究,史努比屏保终于来到了 macOS

📘 关联阅读:Awesome macOS Screensavers - 一些 awesome 的 macOS 屏保

频道:@NewlearnerChannel
#微信公众号 #排版工具 #NeuraPres #免费 #分享

分享一款免费、开源的微信公众号排版工具NeuraPres

简介:NeuraPress是一个现代化的 Markdown 编辑器,专注于提供优质的微信公众号排版体验;特征:响应式设计,支持移动设备;搭配 DeepSeek和微信公众号助手使用,可以在碎片时间用手机发布公众号文章。

项目地址https://github.com/tianyaxiang/neurapress

体验地址https://md.leti.ltd/wechat



📢 频道   ✈️ 群组 (耕读)   📬 投稿
Back to Top