登录 注册

求完善标题块代码片段

本贴最后更新于 252 天前，其中的信息可能已经沧海桑田

写了一个标题标识的代码片段，但有两个问题：① 标题文字增加行内格式时，会重复出现标识图形（以上标形式）；② 标题行右上角重复显示标识。烦请哪位大佬帮助修改一下。

image.png

代码如下：

.protyle-wysiwyg [data-node-id].h1 ::after{
  content:"  1️⃣";
  font-size:0.7em;
  opacity: 0.4;
}
.protyle-wysiwyg [data-node-id].h2 ::after{
  content:"  2️⃣";
  font-size:0.7em;
  opacity: 0.4;
}
.protyle-wysiwyg [data-node-id].h3 ::after{
  content:"  3️⃣";
  font-size:0.8em;
  font-size:0.7em;
  opacity: 0.4;
}
.protyle-wysiwyg [data-node-id].h4 ::after{
 content:"  4️⃣";
  font-size:0.8em;
  font-size:0.7em;
  opacity: 0.4;
}
.protyle-wysiwyg [data-node-id].h5 ::after{
 content:"  5️⃣";
  font-size:0.8em;
  font-size:0.7em;
  opacity: 0.4;
}
.protyle-wysiwyg [data-node-id].h6 ::after{
  content:"  6️⃣";
  font-size:0.8em;
  font-size:0.7em;
  opacity: 0.4;
}
  • 思源笔记

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

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

    22337 引用 • 89380 回帖
  • Q&A

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

    8112 引用 • 37001 回帖 • 160 关注
北京 位置
50 悬赏
2 收藏
1 赞同
9 回帖
5
3
415 116 3 280 1 14 1

相关帖子

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

    改好了：

    div[data-subtype^="h1"]:not([type])>div:first-child:after{
    content:"  1️⃣";
    font-size:0.7em;
    opacity: 0.4;
}
div[data-subtype^="h2"]>div:first-child:after{
    content:"  2️⃣";
    font-size:0.7em;
    opacity: 0.4;
}
div[data-subtype^="h3"]>div:first-child:after{
    content:"  3️⃣";
    font-size:0.8em;
    font-size:0.7em;
    opacity: 0.4;
}
div[data-subtype^="h4"]>div:first-child:after{
    content:"  4️⃣";
    font-size:0.8em;
    font-size:0.7em;
    opacity: 0.4;
}
div[data-subtype^="h5"]>div:first-child:after{
    content:"  5️⃣";
    font-size:0.8em;
    font-size:0.7em;
    opacity: 0.4;
}
div[data-subtype^="h6"]>div:first-child:after{
    content:"  6️⃣";
    font-size:0.8em;
    font-size:0.7em;
    opacity: 0.4;
}
9 回帖
求完善标题块代码片段

欢迎来到这里！

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

注册 关于
请输入回帖内容 ...
  • JeffreyChen • • 1 评论
    付费者 支持者 捐赠者

    @Vanessa 导出 PDF 的时候，文档标题好像是会转换成一级标题。有办法改进这个 CSS 片段吗？

    试试 :not([type])
    Vanessa •
  • 其他回帖
  • Vanessa •
    订阅者 付费者 MOD

    image.png

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

    改好了：

    div[data-subtype^="h1"]:not([type])>div:first-child:after{
    content:"  1️⃣";
    font-size:0.7em;
    opacity: 0.4;
}
div[data-subtype^="h2"]>div:first-child:after{
    content:"  2️⃣";
    font-size:0.7em;
    opacity: 0.4;
}
div[data-subtype^="h3"]>div:first-child:after{
    content:"  3️⃣";
    font-size:0.8em;
    font-size:0.7em;
    opacity: 0.4;
}
div[data-subtype^="h4"]>div:first-child:after{
    content:"  4️⃣";
    font-size:0.8em;
    font-size:0.7em;
    opacity: 0.4;
}
div[data-subtype^="h5"]>div:first-child:after{
    content:"  5️⃣";
    font-size:0.8em;
    font-size:0.7em;
    opacity: 0.4;
}
div[data-subtype^="h6"]>div:first-child:after{
    content:"  6️⃣";
    font-size:0.8em;
    font-size:0.7em;
    opacity: 0.4;
}
    2 回复
    1 操作
    JeffreyChen 在 2024-03-16 12:24:43 更新了该回帖
  • JeffreyChen •
    付费者 支持者 捐赠者

    @intelion 原回帖的 CSS 代码更新了，你重新复制一下。代码片段可能要等到下个版本才能生效（下个版本可能就修复了），到时候你更新了试试再来反馈。

    20240411 确认修复了

    1 回复
    1 操作
    JeffreyChen 在 2024-04-11 23:47:53 更新了该回帖
  • 查看全部回帖
sweesalt
北京
回帖
226
 帖子
58
 积分
2308

近期热议

推荐标签 标签

  • 友情链接

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

    24 引用 • 373 回帖
  • RESTful

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

    30 引用 • 114 回帖 • 2 关注
  • 新人

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

    52 引用 • 228 回帖
  • Kafka

    Kafka 是一种高吞吐量的分布式发布订阅消息系统，它可以处理消费者规模的网站中的所有动作流数据。 这种动作（网页浏览，搜索和其他用户的行动）是现代系统中许多功能的基础。 这些数据通常是由于吞吐量的要求而通过处理日志和日志聚合来解决。

    36 引用 • 35 回帖
  • danl
    • 132 关注
  • 强迫症

    强迫症（OCD）属于焦虑障碍的一种类型，是一组以强迫思维和强迫行为为主要临床表现的神经精神疾病，其特点为有意识的强迫和反强迫并存，一些毫无意义、甚至违背自己意愿的想法或冲动反反复复侵入患者的日常生活。

    15 引用 • 161 回帖
  • 自由行
    • 10 关注
  • 博客

    记录并分享人生的经历。

    273 引用 • 2388 回帖
  • GitLab

    GitLab 是利用 Ruby 一个开源的版本管理系统，实现一个自托管的 Git 项目仓库，可通过 Web 界面操作公开或私有项目。

    46 引用 • 72 回帖
  • 工具

    子曰：“工欲善其事，必先利其器。”

    286 引用 • 729 回帖
  • Jenkins

    Jenkins 是一套开源的持续集成工具。它提供了非常丰富的插件，让构建、部署、自动化集成项目变得简单易用。

    53 引用 • 37 回帖
  • ZeroNet

    ZeroNet 是一个基于比特币加密技术和 BT 网络技术的去中心化的、开放开源的网络和交流系统。

    1 引用 • 21 回帖 • 638 关注
  • GitHub

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

    209 引用 • 2031 回帖
  • 安装

    你若安好，便是晴天。

    132 引用 • 1184 回帖
  • HHKB

    HHKB 是富士通的 Happy Hacking 系列电容键盘。电容键盘即无接点静电电容式键盘（Capacitive Keyboard）。

    5 引用 • 74 回帖 • 471 关注
  • Dubbo

    Dubbo 是一个分布式服务框架，致力于提供高性能和透明化的 RPC 远程服务调用方案，是 [阿里巴巴] SOA 服务化治理方案的核心框架，每天为 2,000+ 个服务提供 3,000,000,000+ 次访问量支持，并被广泛应用于阿里巴巴集团的各成员站点。

    60 引用 • 82 回帖 • 595 关注
  • 黑曜石

    黑曜石是一款强大的知识库工具，支持本地 Markdown 文件编辑，支持双向链接和关系图。

    A second brain, for you, forever.

    15 引用 • 122 回帖
  • 正则表达式

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

    31 引用 • 94 回帖
  • Spring

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

    944 引用 • 1459 回帖 • 17 关注
  • 30Seconds

    📙 前端知识精选集，包含 HTML、CSS、JavaScript、React、Node、安全等方面，每天仅需 30 秒。

    • 精选常见面试题，帮助您准备下一次面试
    • 精选常见交互，帮助您拥有简洁酷炫的站点
    • 精选有用的 React 片段，帮助你获取最佳实践
    • 精选常见代码集，帮助您提高打码效率
    • 整理前端界的最新资讯，邀您一同探索新世界
    488 引用 • 384 回帖 • 8 关注
  • 职场

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

    127 引用 • 1705 回帖 • 1 关注
  • App

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

    91 引用 • 384 回帖
  • 深度学习

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

    53 引用 • 40 回帖 • 2 关注
  • Chrome

    Chrome 又称 Google 浏览器，是一个由谷歌公司开发的网页浏览器。该浏览器是基于其他开源软件所编写，包括 WebKit，目标是提升稳定性、速度和安全性，并创造出简单且有效率的使用者界面。

    62 引用 • 289 回帖 • 1 关注
  • GitBook

    GitBook 使您的团队可以轻松编写和维护高质量的文档。 分享知识，提高团队的工作效率，让用户满意。

    3 引用 • 8 回帖 • 4 关注
  • 域名

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

    43 引用 • 208 回帖
  • abitmean

    有点意思就行了

    • 29 关注

最新标签