登录 注册

[已解决] 求 css 把 bookxnote 外链图标去掉

原贴：目前我用 bookxnote 和思源联动，真的巨巨巨好用，但是这密密麻麻的外链图标（就是那个蓝蓝的圆圆的图标）看得人压力有点大了，主要是不好看，有没有 css 代码能把这个去掉呀

[已经解决啦，感谢评论区几位大佬，有相同困扰的可以看一下评论区，两种 css 都可以使用，全主题适配]

Clip20240306143318.png

  • 思源笔记

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

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

    18802 引用 • 70338 回帖
  • Q&A

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

    6587 引用 • 29565 回帖 • 250 关注
1 操作
yunyunyun 在 2024-03-13 14:59:39 更新了该帖
温州 位置
20 悬赏
1 关注
1 收藏
1 操作
25 回帖
13
5
2
2
291 155 5 113 14

相关帖子

被采纳的回答
  • JeffreyChen • • 1 赞同
    付费者 支持者 捐赠者

    试试用这个 CSS 代码片段能不能覆盖：

    /* bookxnote */
.protyle-wysiwyg [data-node-id] span[data-type~='a'][data-href^="bookxnotepro://"]:not(:empty)::before,
.protyle-wysiwyg [data-node-id] a[href^="bookxnotepro://"]::before,
.b3-typography a[href^="bookxnotepro://"]::before {
    content: "" !important;
    background-image: url('') !important;
}

.protyle-wysiwyg [data-node-id] span[data-type='a'][data-href^="bookxnotepro://"]:not(:empty)::before,
.b3-typography a[href^="bookxnotepro://"]:not(:empty)::before,
.protyle-wysiwyg [data-node-id] a[href^="bookxnotepro://"]:not(:empty)::before {
    display: initial !important;
    position: static !important;
    background-repeat: repeat !important;
    background-size: auto !important;
    top: 0 !important;
    width: auto !important;
    height: auto !important;
    margin-right: 0 !important;
}

    备忘：

    https://github.com/royc01/notion-theme/blob/main/style/custom/link-icon.css#L565C1-L571C2

    https://github.com/royc01/notion-theme/blob/main/style/custom/link-icon.css#L2C1-L13C2

25 回帖
[已解决] 求 css 把 bookxnote 外链图标去掉

欢迎来到这里！

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

注册 关于
请输入回帖内容 ...
  • mozhu •
    订阅者 付费者 支持者 捐赠者

    主题或者插件的话直接去删了，默认应该没有的吧

    1 回复
  • yunyunyun •
    作者

    这个相当于链接，链接自带了图标，有些主题可以把这个图标去掉，有些还在，所以想求一下能够去掉的 css

  • cxg318 •

    bookxnote，是什么东西

    1 回复
  • temacc0531 •

    你这个是主题带的吧

    1 回复
  • yunyunyun •
    作者

    可以看一下这个：[思源笔记经验分享] 使用 Quicker 快速建立 BookxNote 与思源笔记之间的双向链接 - 链滴
    [思源笔记经验分享] 使用 Quicker 快速建立 BookxNote 与思源笔记之间的双向链接

  • yunyunyun •
    作者

    不是，默认就有的，有些主题会调整或去掉

  • JeffreyChen •
    付费者 支持者 捐赠者

    看着很像是这个插件的功能，如果是的话可以自己稍微改一下插件的代码：

    image.png

    1 回复
  • mark-j • • 1
    付费者

    如果你是 savor 这个主题，可以去主题文件夹image.png删除代码

    1 回复
  • mark-j •
    付费者

    image.png也可以输入一个 *，如图效果

  • yunyunyun •
    作者

    我没有下载这个插件呜呜，之前检查过了，没有下任何图标相关的插件

  • yunyunyun •
    作者

    好的好的谢谢我去试试看！我图上的确是写味主题，但是还有其他主题也会有这个效果，如果一个个改有点麻烦，每个主题的情况也不太一样，我就想着用 css 直接一键去掉，不知道能不能实现 TT

    1 回复
  • JeffreyChen • • 1 赞同
    付费者 支持者 捐赠者

    试试用这个 CSS 代码片段能不能覆盖：

    /* bookxnote */
.protyle-wysiwyg [data-node-id] span[data-type~='a'][data-href^="bookxnotepro://"]:not(:empty)::before,
.protyle-wysiwyg [data-node-id] a[href^="bookxnotepro://"]::before,
.b3-typography a[href^="bookxnotepro://"]::before {
    content: "" !important;
    background-image: url('') !important;
}

.protyle-wysiwyg [data-node-id] span[data-type='a'][data-href^="bookxnotepro://"]:not(:empty)::before,
.b3-typography a[href^="bookxnotepro://"]:not(:empty)::before,
.protyle-wysiwyg [data-node-id] a[href^="bookxnotepro://"]:not(:empty)::before {
    display: initial !important;
    position: static !important;
    background-repeat: repeat !important;
    background-size: auto !important;
    top: 0 !important;
    width: auto !important;
    height: auto !important;
    margin-right: 0 !important;
}

    备忘：

    https://github.com/royc01/notion-theme/blob/main/style/custom/link-icon.css#L565C1-L571C2

    https://github.com/royc01/notion-theme/blob/main/style/custom/link-icon.css#L2C1-L13C2

    2 回复
    2 引用
    3 操作
    JeffreyChen 在 2024-03-13 14:48:23 更新了该回帖
    JeffreyChen 在 2024-03-13 14:26:06 更新了该回帖
    JeffreyChen 在 2024-03-13 13:45:21 更新了该回帖
  • yunyunyun •
    作者

    好的非常感谢！我去试试看！

  • yunyunyun •
    作者

    非常感谢，图标已经顺利被隐藏了！！我还想问一下，隐藏过后中间原本图标的地方是被空出来的，请问有没有办法把空格去掉呢？就跟其他主题一样Clip20240313132605.png

    1 回复
  • pakeh2866 •
    付费者

    提供一个.sy 我试试

    2 回复
  • JeffreyChen •
    付费者 支持者 捐赠者

    我更新了原先的回帖，你再试试新的代码片段

    1 回复
  • yunyunyun • • 1 评论
    作者

    我试了一下，好像还是不行诶

    你上传文档我看看
    JeffreyChen •
  • yunyunyun •
    作者

    不好意思我是个小白，不太明白意思，可以具体说一下提供什么，如何提供嘛 😭 😭

    1 回复
  • JeffreyChen •
    付费者 支持者 捐赠者

    在文档树上点击文档右边的三个点「更多」，然后导出.sy.zip

    image.png

    1 回复
  • yunyunyun •
    作者

    感谢，已导出任意一页，里面包含 bookxnote 链接，麻烦你了！🙏 传播过程模式.sy.zip

    1 回复
  • yunyunyun •
    作者

    你好，我已导出任意一页，里面包含 bookxnote 链接，麻烦你了！🙏 传播过程模式.sy.zip

  • JeffreyChen •
    付费者 支持者 捐赠者

    我又更新了原先的回帖，现在的代码片段应该可以了。（之前的漏了几个字母）

    1 回复
  • pakeh2866 • • 2 • 1 赞同 • 1 评论
    付费者 
    /* bookxnote */
.protyle-wysiwyg [data-node-id] span[data-type~='a'][data-href^="bookxnotepro://"]:not(:empty)::before,
.protyle-wysiwyg [data-node-id] a[href^="bookxnotepro://"]::before,
.b3-typography a[href^="bookxnotepro://"]::before {
    content: none;
    background-image: none;
}
    1 回复
    这个更好
    JeffreyChen •
  • yunyunyun •
    作者

    非常感谢！我试了一下效果非常好，而且所有主题都适配，非常感谢！！

  • yunyunyun •
    作者

    谢谢大佬，我刚刚试了一下非常有用！！

请输入回帖内容 ...
yunyunyun
温州
回帖
20
 帖子
4
 积分
378

近期热议

推荐标签 标签

  • 链滴

    链滴是一个记录生活的地方。

    记录生活，连接点滴

    132 引用 • 3647 回帖 • 1 关注
  • 互联网

    互联网（Internet），又称网际网络，或音译因特网、英特网。互联网始于 1969 年美国的阿帕网，是网络与网络之间所串连成的庞大网络，这些网络以一组通用的协议相连，形成逻辑上的单一巨大国际网络。

    96 引用 • 330 回帖
  • Flume

    Flume 是一套分布式的、可靠的，可用于有效地收集、聚合和搬运大量日志数据的服务架构。

    9 引用 • 6 回帖 • 596 关注
  • TextBundle

    TextBundle 文件格式旨在应用程序之间交换 Markdown 或 Fountain 之类的纯文本文件时，提供更无缝的用户体验。

    1 引用 • 2 回帖 • 49 关注
  • Solidity

    Solidity 是一种智能合约高级语言，运行在 [以太坊] 虚拟机（EVM）之上。它的语法接近于 JavaScript，是一种面向对象的语言。

    3 引用 • 18 回帖 • 349 关注
  • Sphinx

    Sphinx 是一个基于 SQL 的全文检索引擎，可以结合 MySQL、PostgreSQL 做全文搜索，它可以提供比数据库本身更专业的搜索功能，使得应用程序更容易实现专业化的全文检索。

    1 引用 • 178 关注
  • TensorFlow

    TensorFlow 是一个采用数据流图（data flow graphs），用于数值计算的开源软件库。节点（Nodes）在图中表示数学操作，图中的线（edges）则表示在节点间相互联系的多维数据数组，即张量（tensor）。

    20 引用 • 19 回帖 • 1 关注
  • PWA

    PWA（Progressive Web App）是 Google 在 2015 年提出、2016 年 6 月开始推广的项目。它结合了一系列现代 Web 技术，在网页应用中实现和原生应用相近的用户体验。

    14 引用 • 69 回帖 • 131 关注
  • 友情链接

    确认过眼神后的灵魂连接，站在链在！

    24 引用 • 373 回帖 • 1 关注
  • 反馈

    Communication channel for makers and users.

    123 引用 • 906 回帖 • 192 关注
  • JVM

    JVM（Java Virtual Machine）Java 虚拟机是一个微型操作系统，有自己的硬件构架体系，还有相应的指令系统。能够识别 Java 独特的 .class 文件（字节码），能够将这些文件中的信息读取出来，使得 Java 程序只需要生成 Java 虚拟机上的字节码后就能在不同操作系统平台上进行运行。

    180 引用 • 120 回帖
  • SOHO

    为成为自由职业者在家办公而努力吧！

    7 引用 • 55 回帖 • 94 关注
  • 深度学习

    深度学习（Deep Learning）是机器学习的分支，是一种试图使用包含复杂结构或由多重非线性变换构成的多个处理层对数据进行高层抽象的算法。

    40 引用 • 40 回帖
  • Oracle

    Oracle（甲骨文）公司，全称甲骨文股份有限公司（甲骨文软件系统有限公司），是全球最大的企业级软件公司，总部位于美国加利福尼亚州的红木滩。1989 年正式进入中国市场。2013 年，甲骨文已超越 IBM，成为继 Microsoft 后全球第二大软件公司。

    103 引用 • 126 回帖 • 445 关注
  • WordPress

    WordPress 是一个使用 PHP 语言开发的博客平台，用户可以在支持 PHP 和 MySQL 数据库的服务器上架设自己的博客。也可以把 WordPress 当作一个内容管理系统（CMS）来使用。WordPress 是一个免费的开源项目，在 GNU 通用公共许可证（GPLv2）下授权发布。

    45 引用 • 113 回帖 • 310 关注
  • Swift

    Swift 是苹果于 2014 年 WWDC（苹果开发者大会）发布的开发语言，可与 Objective-C 共同运行于 Mac OS 和 iOS 平台，用于搭建基于苹果平台的应用程序。

    34 引用 • 37 回帖 • 497 关注
  • RYMCU

    RYMCU 致力于打造一个即严谨又活泼、专业又不失有趣，为数百万人服务的开源嵌入式知识学习交流平台。

    4 引用 • 6 回帖 • 40 关注
  • 持续集成

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

    14 引用 • 7 回帖 • 3 关注
  • Sillot

    Sillot （汐洛）孵化自思源笔记，致力于服务智慧新彖乄，具有彖乄驱动、极致优雅、开发者友好的特点
    Github 地址：https://github.com/Hi-Windom/Sillot

    17 引用 • 6 回帖 • 27 关注
  • 百度

    百度（Nasdaq：BIDU）是全球最大的中文搜索引擎、最大的中文网站。2000 年 1 月由李彦宏创立于北京中关村，致力于向人们提供“简单，可依赖”的信息获取方式。“百度”二字源于中国宋朝词人辛弃疾的《青玉案·元夕》词句“众里寻他千百度”，象征着百度对中文信息检索技术的执著追求。

    63 引用 • 785 回帖 • 250 关注
  • webpack

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

    41 引用 • 130 回帖 • 292 关注
  • Vditor

    Vditor 是一款浏览器端的 Markdown 编辑器，支持所见即所得、即时渲染（类似 Typora）和分屏预览模式。它使用 TypeScript 实现，支持原生 JavaScript、Vue、React 和 Angular。

    314 引用 • 1667 回帖 • 3 关注
  • Maven

    Maven 是基于项目对象模型（POM）、通过一小段描述信息来管理项目的构建、报告和文档的软件项目管理工具。

    186 引用 • 318 回帖 • 342 关注
  • Windows

    Microsoft Windows 是美国微软公司研发的一套操作系统，它问世于 1985 年，起初仅仅是 Microsoft-DOS 模拟环境，后续的系统版本由于微软不断的更新升级，不但易用，也慢慢的成为家家户户人们最喜爱的操作系统。

    215 引用 • 462 回帖 • 1 关注
  • WiFiDog

    WiFiDog 是一套开源的无线热点认证管理工具，主要功能包括：位置相关的内容递送；用户认证和授权；集中式网络监控。

    1 引用 • 7 回帖 • 544 关注
  • 快应用

    快应用 是基于手机硬件平台的新型应用形态；标准是由主流手机厂商组成的快应用联盟联合制定；快应用标准的诞生将在研发接口、能力接入、开发者服务等层面建设标准平台；以平台化的生态模式对个人开发者和企业开发者全品类开放。

    15 引用 • 127 回帖 • 5 关注
  • Gzip

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

    9 引用 • 12 回帖 • 114 关注

最新标签