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

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

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

Clip20240306143318.png

  • 思源笔记

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

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

    19075 引用 • 71662 回帖 • 1 关注
  • Q&A

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

    6659 引用 • 29860 回帖 • 245 关注
1 操作
yunyunyun 在 2024-03-13 14:59:39 更新了该帖

相关帖子

被采纳的回答
  • 试试用这个 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

欢迎来到这里!

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

注册 关于
请输入回帖内容 ...
  • 试试用这个 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 回复
    3 操作
    JeffreyChen 在 2024-03-13 14:48:23 更新了该回帖
    JeffreyChen 在 2024-03-13 14:26:06 更新了该回帖
    JeffreyChen 在 2024-03-13 13:45:21 更新了该回帖
  • 其他回帖
  • 我更新了原先的回帖,你再试试新的代码片段

    1 回复
  • 看着很像是这个插件的功能,如果是的话可以自己稍微改一下插件的代码:

    image.png

    1 回复
  • yunyunyun
    作者

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

    1 回复
  • 查看全部回帖

推荐标签 标签

  • 小说

    小说是以刻画人物形象为中心,通过完整的故事情节和环境描写来反映社会生活的文学体裁。

    28 引用 • 108 回帖
  • RESTful

    一种软件架构设计风格而不是标准,提供了一组设计原则和约束条件,主要用于客户端和服务器交互类的软件。基于这个风格设计的软件可以更简洁,更有层次,更易于实现缓存等机制。

    30 引用 • 114 回帖
  • flomo

    flomo 是新一代 「卡片笔记」 ,专注在碎片化时代,促进你的记录,帮你积累更多知识资产。

    4 引用 • 85 回帖 • 5 关注
  • frp

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

    15 引用 • 7 回帖 • 1 关注
  • 音乐

    你听到信仰的声音了么?

    59 引用 • 509 回帖
  • 星云链

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

    3 引用 • 16 回帖 • 1 关注
  • Markdown

    Markdown 是一种轻量级标记语言,用户可使用纯文本编辑器来排版文档,最终通过 Markdown 引擎将文档转换为所需格式(比如 HTML、PDF 等)。

    165 引用 • 1460 回帖
  • SpaceVim

    SpaceVim 是一个社区驱动的模块化 vim/neovim 配置集合,以模块的方式组织管理插件以
    及相关配置,为不同的语言开发量身定制了相关的开发模块,该模块提供代码自动补全,
    语法检查、格式化、调试、REPL 等特性。用户仅需载入相关语言的模块即可得到一个开箱
    即用的 Vim-IDE。

    3 引用 • 31 回帖 • 76 关注
  • Thymeleaf

    Thymeleaf 是一款用于渲染 XML/XHTML/HTML5 内容的模板引擎。类似 Velocity、 FreeMarker 等,它也可以轻易的与 Spring 等 Web 框架进行集成作为 Web 应用的模板引擎。与其它模板引擎相比,Thymeleaf 最大的特点是能够直接在浏览器中打开并正确显示模板页面,而不需要启动整个 Web 应用。

    11 引用 • 19 回帖 • 319 关注
  • Typecho

    Typecho 是一款博客程序,它在 GPLv2 许可证下发行,基于 PHP 构建,可以运行在各种平台上,支持多种数据库(MySQL、PostgreSQL、SQLite)。

    12 引用 • 60 回帖 • 466 关注
  • 学习

    “梦想从学习开始,事业从实践起步” —— 习近平

    162 引用 • 473 回帖 • 1 关注
  • Sandbox

    如果帖子标签含有 Sandbox ,则该帖子会被视为“测试帖”,主要用于测试社区功能,排查 bug 等,该标签下内容不定期进行清理。

    374 引用 • 1217 回帖 • 580 关注
  • SVN

    SVN 是 Subversion 的简称,是一个开放源代码的版本控制系统,相较于 RCS、CVS,它采用了分支管理系统,它的设计目标就是取代 CVS。

    29 引用 • 98 回帖 • 696 关注
  • Sublime

    Sublime Text 是一款可以用来写代码、写文章的文本编辑器。支持代码高亮、自动完成,还支持通过插件进行扩展。

    10 引用 • 5 回帖
  • WiFiDog

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

    1 引用 • 7 回帖 • 544 关注
  • JVM

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

    180 引用 • 120 回帖 • 4 关注
  • Scala

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

    13 引用 • 11 回帖 • 111 关注
  • GraphQL

    GraphQL 是一个用于 API 的查询语言,是一个使用基于类型系统来执行查询的服务端运行时(类型系统由你的数据定义)。GraphQL 并没有和任何特定数据库或者存储引擎绑定,而是依靠你现有的代码和数据支撑。

    4 引用 • 3 回帖 • 18 关注
  • InfluxDB

    InfluxDB 是一个开源的没有外部依赖的时间序列数据库。适用于记录度量,事件及实时分析。

    2 引用 • 55 关注
  • 脑图

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

    21 引用 • 58 回帖
  • 博客

    记录并分享人生的经历。

    270 引用 • 2386 回帖
  • PHP

    PHP(Hypertext Preprocessor)是一种开源脚本语言。语法吸收了 C 语言、 Java 和 Perl 的特点,主要适用于 Web 开发领域,据说是世界上最好的编程语言。

    165 引用 • 407 回帖 • 526 关注
  • abitmean

    有点意思就行了

    24 关注
  • Redis

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

    284 引用 • 247 回帖 • 163 关注
  • MySQL

    MySQL 是一个关系型数据库管理系统,由瑞典 MySQL AB 公司开发,目前属于 Oracle 公司。MySQL 是最流行的关系型数据库管理系统之一。

    675 引用 • 535 回帖 • 1 关注
  • PWA

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

    14 引用 • 69 回帖 • 135 关注
  • uTools

    uTools 是一个极简、插件化、跨平台的现代桌面软件。通过自由选配丰富的插件,打造你得心应手的工具集合。

    5 引用 • 13 回帖