自己设置了很多 css 代码修改了一些颜色样式,但是导出为 PDF 或 WORD 后,就都变样了。第一张图是笔记中所见样子。



请问有方法解决吗?
自己设置了很多 css 代码修改了一些颜色样式,但是导出为 PDF 或 WORD 后,就都变样了。第一张图是笔记中所见样子。



请问有方法解决吗?
【标题字体及间距】
.protyle-title__input {
width: 100%;
color: var(--b3-theme-on-background);
box-sizing: border-box;
border: 0;
font-size: 1.5em;
font-weight: bold;
line-height: 1.5;
padding: 0px 0px 0px;
white-space: break-spaces;
}
【段间距调整】
.protyle-wysiwyg>.p {
margin: 0px 0px !important;
padding: 0px !important;
}
【首行缩进(抵消图片、列表等)】
/* 段落文字首行缩进(不包含列表中段落) */
.p:not(.list .p) {
text-indent: 2em;
}
/* 抵消缩进对图片的影响 */
.img {
text-indent: -1em;
}
/* 抵消缩进对标签的影响 */
.protyle-wysiwyg [data-node-id] span[data-type='tag']{
text-indent: 0ch;
}
/* 抵消缩进对引述的影响 */
.protyle-wysiwyg [data-node-id].bq > div.bq {
text-indent: -3ch;
}
【大纲标题字体大小及间距】
.protyle-wysiwyg .h1 {
font-size: 1.3em;
font-weight: bold;
}
.protyle-wysiwyg .h2 {
font-size: 1.15em;
}
.b3-typography .h3, .b3-typography h3, .protyle-wysiwyg .h3, .protyle-wysiwyg h3 {
font-size: 1.1em;
}
.protyle-wysiwyg blockquote>p, .protyle-wysiwyg [data-node-id] {
line-height: 1.625;
padding: 0px;
margin: 2px 0;
border-radius: var(--b3-border-radius);
}
【调整标签颜色】
.b3-chip--secondary {
background-color: var(--QYL-av-chip-background2);
color: var(--b3-graph-listitem-point);
}
.b3-chip--primary, .b3-chip--current {
background-color: var(--b3-list-icon-hover);
color: rgb(0 17 255);
}
【隐藏备注表头】
/* 隐藏特定样式的文本内容块 */
div[data-content-type="text"][style*="font-weight:700"] {
display: none !important;
}
【隐藏“添加图标”“添加题头图”按钮】
/* 隐藏“添加图标”按钮 */
button[data-type="icon"] {
display: none !important;
}
/* 隐藏“添加题头图”按钮 */
button[data-type="random"] {
display: none !important;
}
【全局宋体】
body *{
font-family: "Emojis Additional", "Emojis Reset", "宋体", "SimSun", var(--b3-font-family);
}
【调整右下角工具栏顺序】
.status__counter {
display: flex
;
flex-shrink: 0;
font-size: 12px;
flex-direction: row-reverse;
}
【H2\H3 标题缩进 2 字符】
.protyle-wysiwyg .h2 {
text-indent: 2em;
}
.b3-typography .h3, .b3-typography h3, .protyle-wysiwyg .h3, .protyle-wysiwyg h3 {
text-indent: 4em;
}
【修改“引用”“链接”样式】
.protyle-wysiwyg [data-node-id] span[data-type~=block-ref]:not(.av__celltext) {
color: #FF5722;
padding-bottom: 1.5px;
border-bottom: 2px dashed #FF5722;
}
.protyle-wysiwyg [data-node-id] span[data-type~=a] {
color: var(--QYL-link);
padding-bottom: 1.5px;
border-bottom: 2px dashed var(--QYL-link);
}
【修改行级代码样式】
.fn__code, .b3-typography code:not(.hljs), .b3-typography span[data-type~=code], .protyle-wysiwyg code:not(.hljs), .protyle-wysiwyg span[data-type~=code] {
padding: 0em 0.25em;
margin: 0;
font-size: 92%;
border-radius: var(--b3-border-radius);
font-family: var(--b3-font-family-code);
word-break: break-word;
background-size: 20px 20px;
white-space: pre-wrap;
background-color: var(--b3-pdf-background5)
}
pandoc 不支持转换这些样式的,按帖子里那样随便试一个背景颜色就知道了
jsoup 是一款 Java 的 HTML 解析器,可直接解析某个 URL 地址、HTML 文本内容。它提供了一套非常省力的 API,可通过 DOM,CSS 以及类似于 jQuery 的操作方法来取出和操作数据。
Lute 是一款结构化的 Markdown 引擎,支持 Go 和 JavaScript。
uTools 是一个极简、插件化、跨平台的现代桌面软件。通过自由选配丰富的插件,打造你得心应手的工具集合。
OpenStack 是一个云操作系统,通过数据中心可控制大型的计算、存储、网络等资源池。所有的管理通过前端界面管理员就可以完成,同样也可以通过 Web 接口让最终用户部署资源。
Elasticsearch 是一个基于 Lucene 的搜索服务器。它提供了一个分布式多用户能力的全文搜索引擎,基于 RESTful 接口。Elasticsearch 是用 Java 开发的,并作为 Apache 许可条款下的开放源码发布,是当前流行的企业级搜索引擎。设计用于云计算中,能够达到实时搜索,稳定,可靠,快速,安装使用方便。
单点登录(Single Sign On)是目前比较流行的企业业务整合的解决方案之一。SSO 的定义是在多个应用系统中,用户只需要登录一次就可以访问所有相互信任的应用系统。
Sphinx 是一个基于 SQL 的全文检索引擎,可以结合 MySQL、PostgreSQL 做全文搜索,它可以提供比数据库本身更专业的搜索功能,使得应用程序更容易实现专业化的全文检索。
NGINX 是一个高性能的 HTTP 和反向代理服务器,也是一个 IMAP/POP3/SMTP 代理服务器。 NGINX 是由 Igor Sysoev 为俄罗斯访问量第二的 Rambler.ru 站点开发的,第一个公开版本 0.1.0 发布于 2004 年 10 月 4 日。
Electron 基于 Chromium 和 Node.js,让你可以使用 HTML、CSS 和 JavaScript 构建应用。它是一个由 GitHub 及众多贡献者组成的活跃社区共同维护的开源项目,兼容 Mac、Windows 和 Linux,它构建的应用可在这三个操作系统上面运行。
域名(Domain Name),简称域名、网域,是由一串用点分隔的名字组成的 Internet 上某一台计算机或计算机组的名称,用于在数据传输时标识计算机的电子方位(有时也指地理位置)。
禅道是一款国产的开源项目管理软件,她的核心管理思想基于敏捷方法 scrum,内置了产品管理和项目管理,同时又根据国内研发现状补充了测试管理、计划管理、发布管理、文档管理、事务管理等功能,在一个软件中就可以将软件研发中的需求、任务、bug、用例、计划、发布等要素有序的跟踪管理起来,完整地覆盖了项目管理的核心流程。
知乎是网络问答社区,连接各行各业的用户。用户分享着彼此的知识、经验和见解,为中文互联网源源不断地提供多种多样的信息。
Vue.js(读音 /vju ː/,类似于 view)是一个构建数据驱动的 Web 界面库。Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。
宕机,多指一些网站、游戏、网络应用等服务器一种区别于正常运行的状态,也叫“Down 机”、“当机”或“死机”。宕机状态不仅仅是指服务器“挂掉了”、“死机了”状态,也包括服务器假死、停用、关闭等一些原因而导致出现的不能够正常运行的状态。
LeetCode(力扣)是一个全球极客挚爱的高质量技术成长平台,想要学习和提升专业能力从这里开始,充足技术干货等你来啃,轻松拿下 Dream Offer!
Telegram 是一个非盈利性、基于云端的即时消息服务。它提供了支持各大操作系统平台的开源的客户端,也提供了很多强大的 APIs 给开发者创建自己的客户端和机器人。
千千块(自定义块 css 和 js)
可以用 ai 提示词来无限创作思源笔记
京东是中国最大的自营式电商企业,2015 年第一季度在中国自营式 B2C 电商市场的占有率为 56.3%。2014 年 5 月,京东在美国纳斯达克证券交易所正式挂牌上市(股票代码:JD),是中国第一个成功赴美上市的大型综合型电商平台,与腾讯、百度等中国互联网巨头共同跻身全球前十大互联网公司排行榜。
Notion - The all-in-one workspace for your notes, tasks, wikis, and databases.
星云链是一个开源公链,业内简单的将其称为区块链上的谷歌。其实它不仅仅是区块链搜索引擎,一个公链的所有功能,它基本都有,比如你可以用它来开发部署你的去中心化的 APP,你可以在上面编写智能合约,发送交易等等。3 分钟快速接入星云链 (NAS) 测试网
红帽提供的 PaaS 云,支持多种编程语言,为开发人员提供了更为灵活的框架、存储选择。
OkHttp 是一款 HTTP & HTTP/2 客户端库,专为 Android 和 Java 应用打造。
flomo 是新一代 「卡片笔记」 ,专注在碎片化时代,促进你的记录,帮你积累更多知识资产。
欢迎来到这里!
我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。
注册 关于