登录 注册

想知道锤子便签主题的边框背景颜色的代码和标题用的是什么字体

想知道笔记插件锤子便签主题的边框背景颜色的代码和标题用的是什么字体（见图中蓝色圈出部分）

捕获 2.JPG

另外，想知道如何更换笔记正文字体的字体颜色，笔记自带外观-字体颜色中没有喜欢的字体颜色，笔记插件“配色方案”和“TE 颜色选择器”不太会用，代码也不太懂，还有没有其它办法，新手小白一枚，谢谢啦

  • 思源笔记

    思源笔记是一款隐私优先的个人知识管理系统，支持完全离线使用，同时也支持端到端加密同步。

    融合块、大纲和双向链接，重构你的思维。

    22933 引用 • 92209 回帖 • 1 关注
  • Q&A

    提问之前请先看《提问的智慧》，好的问题比好的答案更有价值。

    8408 引用 • 38315 回帖 • 156 关注
蚌埠 位置 8 回帖
4
4
245 123 117 2 3

相关帖子

被采纳的回答
  • wilsons • • 3
    付费者 捐赠者

    边框背景颜色的代码，这个背景其实是个图片，更换图片即可

    图片路径：conf/appearance/themes/chuizi/src/background1.jpg

    .fn__flex.fn__flex-1 {
    background-image: url(../../src/background1.jpg);
}

    标题字体是 systh，参见下面的代码

    这个字体的路径在 conf/appearance/themes/chuizi/src/SourceHanSerifCN-Heavy.ttf

    .block__logo, .b3-dialog__container .config__panel>.b3-tab-bar::before, .protyle-title__input, .sy__outline .b3-list-item[title] {
    font-family: "systh" !important;
    font-weight: bold !important;
}

    如何更换笔记正文字体的字体颜色，锤子主题的正文颜色继承自 body，其实如果单纯想改变正文颜色，建议用下面的样式（把下面的代码添加到设置 》外观 》代码片段 》css 里即可）

    .protyle-wysiwyg, .protyle-preview p {
    /* 颜色根据自己喜好修改，这里仅仅是演示，具体颜色值可自定义或吸色工具吸取或通过在线调色版复制 */
    color: red;
}

    效果

    image.png

8 回帖
想知道锤子便签主题的边框背景颜色的代码和标题用的是什么字体

欢迎来到这里！

我们正在构建一个小众社区，大家在这里相互信任，以平等 • 自由 • 奔放的价值观进行分享交流。最终，希望大家能够找到与自己志同道合的伙伴，共同成长。

注册 关于
请输入回帖内容 ...
  • wilsons • • 3
    付费者 捐赠者

    边框背景颜色的代码，这个背景其实是个图片，更换图片即可

    图片路径：conf/appearance/themes/chuizi/src/background1.jpg

    .fn__flex.fn__flex-1 {
    background-image: url(../../src/background1.jpg);
}

    标题字体是 systh，参见下面的代码

    这个字体的路径在 conf/appearance/themes/chuizi/src/SourceHanSerifCN-Heavy.ttf

    .block__logo, .b3-dialog__container .config__panel>.b3-tab-bar::before, .protyle-title__input, .sy__outline .b3-list-item[title] {
    font-family: "systh" !important;
    font-weight: bold !important;
}

    如何更换笔记正文字体的字体颜色，锤子主题的正文颜色继承自 body，其实如果单纯想改变正文颜色，建议用下面的样式（把下面的代码添加到设置 》外观 》代码片段 》css 里即可）

    .protyle-wysiwyg, .protyle-preview p {
    /* 颜色根据自己喜好修改，这里仅仅是演示，具体颜色值可自定义或吸色工具吸取或通过在线调色版复制 */
    color: red;
}

    效果

    image.png

    1 回复
    1 操作
    wilsons 在 2024-08-18 13:23:08 更新了该回帖
  • 其他回帖
  • xueluo •
    作者

    请问笔记正文字体和块的背景颜色（图中蓝色圈出部分）

    捕获 3.JPG

    能否更换成你所说的边框背景图片或者实现类似的效果

    image.png

    1 回复
    1 操作
    xueluo 在 2024-08-18 17:50:14 更新了该回帖
  • xueluo •
    作者

    根据你提供的代码片段，安装后显示结果如下：

    1.jpg

    想要实现以下效果:

    1、紫色、红色圈出部分不显示边框背景图片效果，希望与正文背景颜色（绿色圈出部分）一致；

    2、蓝色圈出部分显示边框背景效果

    谢谢大佬 🙏 🙏

    2 回复
  • wilsons • • 1
    付费者 捐赠者

    我根据你说的效果，做了一个模板，仅供参考，图标和文字，你自己改改，如果自定义其他样式，可参考模板里的 style 属性做调整。

    模板代码

    https://github.com/wish5115/my-softs/blob/main/templates/%E6%80%9D%E6%BA%90-%E5%81%A5%E5%BA%B7%E5%B0%8F%E8%B4%B4%E5%A3%AB.md?plain=1#L1

    下载上面的代码或保存为 xxxxx.md，然后放到/data/templates/文件夹中，然后就可以通过斜杠命令 /模板 进行导入了

    效果

    image.png

    也可参考这里的代码，感觉两个需求类似

    分享用 Savor Callout 插件实现康奈尔笔记和九宫格笔记模板

    1 回复
  • 查看全部回帖
xueluo
蚌埠
回帖
41
 帖子
16
 积分
4487

近期热议

推荐标签 标签

  • golang

    Go 语言是 Google 推出的一种全新的编程语言，可以在不损失应用程序性能的情况下降低代码的复杂性。谷歌首席软件工程师罗布派克（Rob Pike）说：我们之所以开发 Go，是因为过去 10 多年间软件开发的难度令人沮丧。Go 是谷歌 2009 发布的第二款编程语言。

    497 引用 • 1388 回帖 • 278 关注
  • Love2D

    Love2D 是一个开源的， 跨平台的 2D 游戏引擎。使用纯 Lua 脚本来进行游戏开发。目前支持的平台有 Windows, Mac OS X, Linux, Android 和 iOS。

    14 引用 • 53 回帖 • 535 关注
  • Vim

    Vim 是类 UNIX 系统文本编辑器 Vi 的加强版本，加入了更多特性来帮助编辑源代码。Vim 的部分增强功能包括文件比较（vimdiff）、语法高亮、全面的帮助系统、本地脚本（Vimscript）和便于选择的可视化模式。

    29 引用 • 66 回帖
  • React

    React 是 Facebook 开源的一个用于构建 UI 的 JavaScript 库。

    192 引用 • 291 回帖 • 371 关注
  • 宕机

    宕机，多指一些网站、游戏、网络应用等服务器一种区别于正常运行的状态，也叫“Down 机”、“当机”或“死机”。宕机状态不仅仅是指服务器“挂掉了”、“死机了”状态，也包括服务器假死、停用、关闭等一些原因而导致出现的不能够正常运行的状态。

    13 引用 • 82 回帖 • 62 关注
  • GitHub

    GitHub 于 2008 年上线，目前，除了 Git 代码仓库托管及基本的 Web 管理界面以外，还提供了订阅、讨论组、文本渲染、在线文件编辑器、协作图谱（报表）、代码片段分享（Gist）等功能。正因为这些功能所提供的便利，又经过长期的积累，GitHub 的用户活跃度很高，在开源世界里享有深远的声望，并形成了社交化编程文化（Social Coding）。

    209 引用 • 2031 回帖
  • 持续集成

    持续集成（Continuous Integration）是一种软件开发实践，即团队开发成员经常集成他们的工作，通过每个成员每天至少集成一次，也就意味着每天可能会发生多次集成。每次集成都通过自动化的构建（包括编译，发布，自动化测试）来验证，从而尽早地发现集成错误。

    15 引用 • 7 回帖 • 1 关注
  • 职场

    找到自己的位置，萌新烦恼少。

    127 引用 • 1706 回帖
  • Pipe

    Pipe 是一款小而美的开源博客平台。Pipe 有着非常活跃的社区，可将文章作为帖子推送到社区，来自社区的回帖将作为博客评论进行联动（具体细节请浏览 B3log 构思 - 分布式社区网络）。

    这是一种全新的网络社区体验，让热爱记录和分享的你不再感到孤单！

    132 引用 • 1114 回帖 • 126 关注
  • JSON

    JSON （JavaScript Object Notation）是一种轻量级的数据交换格式。易于人类阅读和编写。同时也易于机器解析和生成。

    52 引用 • 190 回帖
  • CloudFoundry

    Cloud Foundry 是 VMware 推出的业界第一个开源 PaaS 云平台，它支持多种框架、语言、运行时环境、云平台及应用服务，使开发人员能够在几秒钟内进行应用程序的部署和扩展，无需担心任何基础架构的问题。

    5 引用 • 18 回帖 • 173 关注
  • 脑图

    脑图又叫思维导图，是表达发散性思维的有效图形思维工具 ，它简单却又很有效，是一种实用性的思维工具。

    29 引用 • 96 回帖
  • Redis

    Redis 是一个开源的使用 ANSI C 语言编写、支持网络、可基于内存亦可持久化的日志型、Key-Value 数据库，并提供多种语言的 API。从 2010 年 3 月 15 日起，Redis 的开发工作由 VMware 主持。从 2013 年 5 月开始，Redis 的开发由 Pivotal 赞助。

    286 引用 • 248 回帖 • 45 关注
  • WebComponents

    Web Components 是 W3C 定义的标准，它给了前端开发者扩展浏览器标签的能力，可以方便地定制可复用组件，更好的进行模块化开发，解放了前端开发者的生产力。

    1 引用 • 5 关注
  • Shell

    Shell 脚本与 Windows/Dos 下的批处理相似，也就是用各类命令预先放入到一个文件中，方便一次性执行的一个程序文件，主要是方便管理员进行设置或者管理用的。但是它比 Windows 下的批处理更强大，比用其他编程程序编辑的程序效率更高，因为它使用了 Linux/Unix 下的命令。

    123 引用 • 74 回帖
  • Android

    Android 是一种以 Linux 为基础的开放源码操作系统，主要使用于便携设备。2005 年由 Google 收购注资，并拉拢多家制造商组成开放手机联盟开发改良，逐渐扩展到到平板电脑及其他领域上。

    334 引用 • 323 回帖 • 3 关注
  • 星云链

    星云链是一个开源公链，业内简单的将其称为区块链上的谷歌。其实它不仅仅是区块链搜索引擎，一个公链的所有功能，它基本都有，比如你可以用它来开发部署你的去中心化的 APP，你可以在上面编写智能合约，发送交易等等。3 分钟快速接入星云链 (NAS) 测试网

    3 引用 • 16 回帖 • 5 关注
  • 微服务

    微服务架构是一种架构模式，它提倡将单一应用划分成一组小的服务。服务之间互相协调，互相配合，为用户提供最终价值。每个服务运行在独立的进程中。服务于服务之间才用轻量级的通信机制互相沟通。每个服务都围绕着具体业务构建，能够被独立的部署。

    96 引用 • 155 回帖
  • sts
    2 引用 • 2 回帖 • 196 关注
  • 七牛云

    七牛云是国内领先的企业级公有云服务商，致力于打造以数据为核心的场景化 PaaS 服务。围绕富媒体场景，七牛先后推出了对象存储，融合 CDN 加速，数据通用处理，内容反垃圾服务，以及直播云服务等。

    27 引用 • 225 回帖 • 165 关注
  • BookxNote

    BookxNote 是一款全新的电子书学习工具，助力您的学习与思考，让您的大脑更高效的记忆。

    笔记整理交给我，一心只读圣贤书。

    1 引用 • 1 回帖
  • 新人

    让我们欢迎这对新人。哦，不好意思说错了，让我们欢迎这位新人！
    新手上路，请谨慎驾驶！

    52 引用 • 228 回帖
  • frp

    frp 是一个可用于内网穿透的高性能的反向代理应用，支持 TCP、UDP、 HTTP 和 HTTPS 协议。

    20 引用 • 7 回帖 • 3 关注
  • 又拍云

    又拍云是国内领先的 CDN 服务提供商,国家工信部认证通过的“可信云”，乌云众测平台认证的“安全云”，为移动时代的创业者提供新一代的 CDN 加速服务。

    21 引用 • 37 回帖 • 548 关注
  • 设计模式

    设计模式（Design pattern）代表了最佳的实践，通常被有经验的面向对象的软件开发人员所采用。设计模式是软件开发人员在软件开发过程中面临的一般问题的解决方案。这些解决方案是众多软件开发人员经过相当长的一段时间的试验和错误总结出来的。

    200 引用 • 120 回帖 • 1 关注
  • App

    App（应用程序，Application 的缩写）一般指手机软件。

    91 引用 • 384 回帖
  • 倾城之链
    23 引用 • 66 回帖 • 135 关注

最新标签