登录 注册

求助反链面板的提示颜色 css 怎么修改

捕获.PNG

如图，这是我的块链接样式

12.PNG

当它出现在反链面板中，面板提示这个引用块，背景色是这种橙色，和我的引用块颜色彻底融合，无法分清。我用的是思源原生 midnight 样式。

更详细的说法：ctrl+ 鼠标，点击文档树上的引用块数字，那个悬浮面板中所呈现的，“引用块”和提示色混在了一起。

求一份可以更改这个提示色的 css。

  • 思源笔记

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

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

    22250 引用 • 88929 回帖
  • Q&A

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

    8073 引用 • 36877 回帖 • 162 关注
1 引用
重新开贴，求一份反链面板的高亮色修改 css • Floria233
1 引用
7 回帖
4
3
81 62 1 16 1

相关帖子

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

    用这个 css 代码块试试，具体颜色值请根据自己需要修改

    .protyle-wysiwyg [data-node-id] span[data-type~=block-ref]:not(.av__celltext), .protyle-wysiwyg [data-node-id] span[data-type~=file-annotation-ref] {
    color: red!important; /* 根据自己需要修改这里的颜色 */
    background-color: transparent!important; /* 不显示背景色，如果需要背景色，请删除该行代码即可 */
}
7 回帖
求助反链面板的提示颜色 css 怎么修改

欢迎来到这里！

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

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

    用这个 css 代码块试试，具体颜色值请根据自己需要修改

    .protyle-wysiwyg [data-node-id] span[data-type~=block-ref]:not(.av__celltext), .protyle-wysiwyg [data-node-id] span[data-type~=file-annotation-ref] {
    color: red!important; /* 根据自己需要修改这里的颜色 */
    background-color: transparent!important; /* 不显示背景色，如果需要背景色，请删除该行代码即可 */
}
    2 回复
  • Floria233 •
    付费者 作者

    感谢，这个很好用啊 ❤️

  • Floria233 •
    付费者 作者

    大大，我忽然发现一个奇怪的问题。

    当我用你给的 css 修改了这个悬浮面板里面的提示后，我的正文内链接也变得和反链面板的样式一样。

    详细点说法：根据大大你提供的代码，我给悬浮面板里的 css 只修改了颜色背景，结果现在正文里出现的链接样式也会增加颜色背景。

    如图，这是现在正文的样式

    正文.PNG

    这是现在悬浮面板的链接样式

    反链面板.PNG

    而之前，我的正文引用样式是这个样的

    捕获.PNG

    我希望的是，正文引用样式还是我之前的设置，只给这个悬浮面板里的块引用样式增加背景色。

    我用你给的 css 修改成了如下代码（直接删掉了文字色，只保留背景色）

    .protyle-wysiwyg [data-node-id] span[data-type~=block-ref]:not(.av__celltext), .protyle-wysiwyg [data-node-id] span[data-type~=file-annotation-ref] {
    background-color:rgb(249, 210, 228,0.2) !important; /* 不显示背景色，如果需要背景色，请删除该行代码即可 */
}

    之前这个 midnight 引用链的原生样式是紫色

    这是我修改的引用链样式颜色

    你给的代码，和我自己改的代码似乎发生了某种冲突，请问要怎么修改，才能恢复我之前的引用链样式效果？（并且保留悬浮框里的引用链背景颜色？）

     .protyle-wysiwyg [data-node-id] span[data-type~=block-ref][data-subtype="d"]{ color: rgb(255, 182, 193);
 border-radius: 5px;
 border-bottom: 2.2px dashed !important; rgb(255, 182, 193);
}

.protyle-wysiwyg [data-node-id] span[data-type~=block-ref][data-subtype="s"]{ color: rgb(255, 182, 193);
 border-radius: 5px;
 border-bottom: 2.2px dashed !important; rgb(255, 182, 193);
background-color:transparent!important;
}
    1 回复
  • wilsons •
    付费者 捐赠者

    添加.backlinkList 即可，限制仅反链才背景透明，然后你用下面这段代码，不会和其他的产生冲突。

    .backlinkList .protyle-wysiwyg [data-node-id] span[data-type~=block-ref]:not(.av__celltext), .backlinkList .protyle-wysiwyg [data-node-id] span[data-type~=file-annotation-ref] {
    /*color: red!important;*/ /* 根据自己需要修改这里的颜色 */
    background-color: transparent!important; /* 不显示背景色，如果需要背景色，请删除该行代码即可 */
}
    1 回复
  • Floria233 •
    付费者 作者

    大大，这个代码好像是无效的 😂

    我测试了一下——直接复制这段代码，不修改任何参数。

    目前反链面板里的引用样式，变成了这样。

    image.png

    即， 它甚至没有让代码里要求的“反链字体”变成红色，这个命令生效。

    不过，现在我的原生引用样式倒是恢复正常，变回最开始的模样。但这个只用我自己之前写的 css 就能办到

    so……究竟是哪里出了问题？😂 烦请赐教。这个真是很困扰。

    image.png

    1 回复
  • wilsons •
    付费者 捐赠者
    1. 为什么红色不生效，因为我给你的代码里颜色注释了，根据自己需要开启即可。
    2. 为什么背景色透明也没生效，可能你之前的代码的 css 优先级比这个样式的高。

    总之，这里仅提供思路，即，添加.backlinkList 可限制仅反链起作用，至于你环境的代码为什么不生效，请根据自己的情况修改。

    1 回复
  • Floria233 •
    付费者 作者

    明白了。最开始陷入了一种思维误区，默认 back-ground 是用来修改和增加样式的，没想到居然“不需要就删除”？这行代码有点让人困惑。

    不过，我需要的刚好就是 反链面板里有字体“背景色”（只不要是原来那种看不清楚的橙色），而不要修改反链的字体样式。

    这应当是我弄混了一些概念。

    我的问题，其实应当是跟反链面板的引用字体样式无关，而是跟反链面板的“链接高亮”色有关。

    即，反链面板里，现在呈现的引用样式，用我自己修改的就可以——它确实没有问题。

    但，思源 midnight 原生主题，所给出的代码设定，会在反链悬浮面板跳出来之后，用一种橙色高亮来提示所有被引用的链接。这种时候，这个高亮色和我修改的样式撞了。

    感谢感谢。

    我另外开贴求助吧，从昨天到今天一直都挺迷惑，现在终于想清楚，这才是真正的问题。

请输入回帖内容 ...
Floria233
回帖
120
 帖子
27
 积分
1310

近期热议

推荐标签 标签

  • JWT

    JWT（JSON Web Token）是一种用于双方之间传递信息的简洁的、安全的表述性声明规范。JWT 作为一个开放的标准（RFC 7519），定义了一种简洁的，自包含的方法用于通信双方之间以 JSON 的形式安全的传递信息。

    20 引用 • 15 回帖 • 1 关注
  • 前端

    前端技术一般分为前端设计和前端开发，前端设计可以理解为网站的视觉设计，前端开发则是网站的前台代码实现，包括 HTML、CSS 以及 JavaScript 等。

    247 引用 • 1347 回帖
  • 星云链

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

    3 引用 • 16 回帖
  • 域名

    域名（Domain Name），简称域名、网域，是由一串用点分隔的名字组成的 Internet 上某一台计算机或计算机组的名称，用于在数据传输时标识计算机的电子方位（有时也指地理位置）。

    43 引用 • 208 回帖
  • 支付宝

    支付宝是全球领先的独立第三方支付平台，致力于为广大用户提供安全快速的电子支付/网上支付/安全支付/手机支付体验，及转账收款/水电煤缴费/信用卡还款/AA 收款等生活服务应用。

    29 引用 • 347 回帖 • 3 关注
  • Flutter

    Flutter 是谷歌的移动 UI 框架，可以快速在 iOS 和 Android 上构建高质量的原生用户界面。 Flutter 可以与现有的代码一起工作，它正在被越来越多的开发者和组织使用，并且 Flutter 是完全免费、开源的。

    39 引用 • 92 回帖 • 4 关注
  • webpack

    webpack 是一个用于前端开发的模块加载器和打包工具，它能把各种资源，例如 JS、CSS（less/sass）、图片等都作为模块来使用和处理。

    41 引用 • 130 回帖 • 263 关注
  • IDEA

    IDEA 全称 IntelliJ IDEA，是一款 Java 语言开发的集成环境，在业界被公认为最好的 Java 开发工具之一。IDEA 是 JetBrains 公司的产品，这家公司总部位于捷克共和国的首都布拉格，开发人员以严谨著称的东欧程序员为主。

    180 引用 • 400 回帖
  • 房星科技

    房星网，我们不和没有钱的程序员谈理想，我们要让程序员又有理想又有钱。我们有雄厚的房地产行业线下资源，遍布昆明全城的 100 家门店、四千地产经纪人是我们坚实的后盾。

    6 引用 • 141 回帖 • 586 关注
  • CentOS

    CentOS（Community Enterprise Operating System）是 Linux 发行版之一，它是来自于 Red Hat Enterprise Linux 依照开放源代码规定释出的源代码所编译而成。由于出自同样的源代码，因此有些要求高度稳定的服务器以 CentOS 替代商业版的 Red Hat Enterprise Linux 使用。两者的不同在于 CentOS 并不包含封闭源代码软件。

    238 引用 • 224 回帖
  • Java

    Java 是一种可以撰写跨平台应用软件的面向对象的程序设计语言，是由 Sun Microsystems 公司于 1995 年 5 月推出的。Java 技术具有卓越的通用性、高效性、平台移植性和安全性。

    3187 引用 • 8213 回帖
  • Spring

    Spring 是一个开源框架，是于 2003 年兴起的一个轻量级的 Java 开发框架，由 Rod Johnson 在其著作《Expert One-On-One J2EE Development and Design》中阐述的部分理念和原型衍生而来。它是为了解决企业应用开发的复杂性而创建的。框架的主要优势之一就是其分层架构，分层架构允许使用者选择使用哪一个组件，同时为 JavaEE 应用程序开发提供集成的框架。

    944 引用 • 1459 回帖 • 24 关注
  • JSON

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

    52 引用 • 190 回帖 • 2 关注
  • Hexo

    Hexo 是一款快速、简洁且高效的博客框架，使用 Node.js 编写。

    21 引用 • 140 回帖 • 3 关注
  • 智能合约

    智能合约（Smart contract）是一种旨在以信息化方式传播、验证或执行合同的计算机协议。智能合约允许在没有第三方的情况下进行可信交易，这些交易可追踪且不可逆转。智能合约概念于 1994 年由 Nick Szabo 首次提出。

    1 引用 • 11 回帖 • 7 关注
  • 正则表达式

    正则表达式（Regular Expression）使用单个字符串来描述、匹配一系列遵循某个句法规则的字符串。

    31 引用 • 94 回帖
  • Ngui

    Ngui 是一个 GUI 的排版显示引擎和跨平台的 GUI 应用程序开发框架，基于
    Node.js / OpenGL。目标是在此基础上开发 GUI 应用程序可拥有开发 WEB 应用般简单与速度同时兼顾 Native 应用程序的性能与体验。

    7 引用 • 9 回帖 • 389 关注
  • Gzip

    gzip （GNU zip）是 GNU 自由软件的文件压缩程序。我们在 Linux 中经常会用到后缀为 .gz 的文件，它们就是 Gzip 格式的。现今已经成为互联网上使用非常普遍的一种数据压缩格式，或者说一种文件格式。

    9 引用 • 12 回帖 • 134 关注
  • OpenShift

    红帽提供的 PaaS 云，支持多种编程语言，为开发人员提供了更为灵活的框架、存储选择。

    14 引用 • 20 回帖 • 632 关注
  • VirtualBox

    VirtualBox 是一款开源虚拟机软件，最早由德国 Innotek 公司开发，由 Sun Microsystems 公司出品的软件，使用 Qt 编写，在 Sun 被 Oracle 收购后正式更名成 Oracle VM VirtualBox。

    10 引用 • 2 回帖 • 7 关注
  • 思源笔记

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

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

    22250 引用 • 88929 回帖
  • Unity

    Unity 是由 Unity Technologies 开发的一个让开发者可以轻松创建诸如 2D、3D 多平台的综合型游戏开发工具，是一个全面整合的专业游戏引擎。

    25 引用 • 7 回帖 • 172 关注
  • Scala

    Scala 是一门多范式的编程语言，集成面向对象编程和函数式编程的各种特性。

    13 引用 • 11 回帖 • 128 关注
  • 音乐

    你听到信仰的声音了么？

    60 引用 • 511 回帖 • 1 关注
  • ngrok

    ngrok 是一个反向代理，通过在公共的端点和本地运行的 Web 服务器之间建立一个安全的通道。

    7 引用 • 63 回帖 • 628 关注
  • abitmean

    有点意思就行了

    • 31 关注
  • 微信

    腾讯公司 2011 年 1 月 21 日推出的一款手机通讯软件。用户可以通过摇一摇、搜索号码、扫描二维码等添加好友和关注公众平台，同时可以将自己看到的精彩内容分享到微信朋友圈。

    130 引用 • 793 回帖 • 1 关注

最新标签