前言 前面 改进了 blogger编辑器, 加入了 pre 和 code 的功能按钮 也 改进了 博客的模板, 能更好的显示 blockquote, pre, code 然后就觉得, 编辑器里面的显示效果有点丑. 主要是原本编辑器就没有 pre 和 code 的功能, 没有合适的显示效果. 思路 我就想, 如果我把 模板里面的CSS片段抽出来, 然后应用到 编辑器页面, 不就行了吗? 先让Agent帮我把之前制作的模板里面关于 h2, p, blockquote, code, pre 的CSS 抽取出来, 得到 h2 { border-bottom: 1px solid #e8eaed; padding-bottom: 6px; } p { margin: 0.85em 0; } blockquote { margin: 1em 0; padding: 8px 16px; border-left: 4px solid #dadce0; color: #5f6368; background: #fafafa; line-height: 1.55; } code { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; background: #f1f3f4; border-radius: 4px; padding: 2px 5px; } pre { background: #f8f9fa; border: 1px solid #e0e0e0; border-radius: 6px; padding: 12px 14px; overflow-x: auto; line-height: 1.55; } 把 Stylebot插件 开起来, 准备插入CSS, 结果发现编辑器中间所见即所得WYSIWYG的区域是个iframe 面向GPT开发 本来是打算 像上次一样, 用Antigravity 的, 但是怕额度不够. 问的是网页版免费账户 Claude 有没有办法给页面中的iframe里面注入CSS? 这一看就是该油猴脚本干的活. 开F12开发者工具, 拿到这个iframe的 class="ZW3ZFc" 然后: 写一个油猴脚本, 选择 iframe 元素 class=ZW3ZFc 插入CSS …略 效果 Github G站/crazypeace/blogger-editor-css/raw/refs/heads/main/blogger-editor-iframe-css.user.js 1 个帖子 - 1 位参与者 阅读完整话题


  • 情报分类:技术学习与提效
  • 分类依据:中文内容,讲用油猴脚本给编辑器iframe注入CSS,属技术提效
  • 信息来源:服务器 / LINUX DO - 最新话题
  • 发布时间:2026/9/13 09:22:46