登录 注册

请问思源有没有办法单独调整每个页面的 "显示字号" 和 "页面宽度"，要单独调整不影响其它页面

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

目前调整显示字号的方法是 按住 command 键 + 触控板放大缩小，但会影响所有页面，很不方便。

  • 有的页面是数据库，需要普通字号，以保证显示格式。
  • 有的页面是文字，编辑时需要大字号，编辑完后需要缩小
  • 数据库页面 和文字页面，分屏使用时，显示字号会互相影响，需要不同的显示字号
  • 文字页面每行只有 15 个字，页面不需要太宽。
  • 数据库页面列数比较多，页面需要全宽。
  • 试过页面的自适应宽度，效果比较差(数据库页默认不是全宽，只有左右滑动时才是全宽，并且光标经过时会有一个选中的高亮区域，很难用；文字页面也无法做到极窄的宽度。）
  • 思源笔记

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

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

    28442 引用 • 119757 回帖
  • Q&A

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

    11151 引用 • 50644 回帖 • 52 关注
1 引用
求一个数据库全宽显示的代码片段 • wilsons
哈尔滨 位置
200 悬赏
2 收藏
1 引用
21 回帖
12
5
2
519 136 8 77 298

相关帖子

被采纳的回答
21 回帖
请问思源有没有办法单独调整每个页面的 "显示字号" 和 "页面宽度"，要单独调整不影响其它页面

欢迎来到这里！

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

注册 关于
请输入回帖内容 ...
  • carethink •
    作者

    😭

  • 365 •
    付费者

    我能理解你滴感受，尤其是需要分屏记笔记的时候

  • 365 •
    付费者

    image.png

    可能和你这个回答相关性不是很大，供参考
    我的方法是，在空白处按 enter，创建很多个块
    选中这些块，右键，外观，往下滑，找到字号
    选择合适的字体大小
    后续在这些块上的字体，都会是你一开始选择的大小

    2 回复
  • Wetoria • • 2
    订阅者 付费者 捐赠者 恶龙

    给文档添加自定义属性，比如 custom-doc-style="1"，然后在外观-代码片段里添加具体样式，比如：

    .protyle-wysiwyg[custom-custom-doc-style="1"] {
  font-size: 12px;
  width: 100%;
  padding: 16px 20px 64px !important;
}

    需要绑定样式的就添加这个自定义属性，你也可以添加多套主题。

    图左是添加了的，不影响右侧普通文档的效果：

    image.png

    2 回复
  • wenbocn •
    付费者

    单个页面宽度的调整，可以参考这个帖子。

    Ctrl+ 鼠标滚轮临时调整页面宽度（js 代码） - 链滴

    1 回复
  • carethink •
    作者

    我试了下，好像是失效了，或者说 mac 环境下不起作用呢，我是 mac+ 触控板 😂

    ，不过这个思路 我确实觉得蛮好的

  • wilsons •
    付费者 捐赠者

    调字号可参考这个帖子 [js] 在右侧边栏添加快捷切换指定大小字号按钮

    1 回复
  • carethink •
    作者

    感谢~ 这个方法很有效！我用 font-size 控制了字号大小，width 我测试是控制块宽度的，请问是否也可以用某个参数控制页面宽度呀。

  • carethink •
    作者

    这个方法挺不错，我试了确实有效，只不过每个文档的块太多， 有点麻烦， 不过依然非常感谢~

  • carethink •
    作者

    感谢大佬 ， 很早就已经用上您这个代码了

    1 回复
  • carethink •
    作者

    我好像找到控制页面宽度的参数了。 是"centerWidth"，但是在您的代码里添加后，不生效，很奇怪

    .protyle-wysiwyg[custom-custom-doc-style="1"] {
font-size: 36px;
width: 100%;
centerWidth: 100%;
padding: 16px 20px 64px !important;
}
  • carethink • • 2 评论
    作者

    亲，您有没有类似的方法，控制住块、或者页面的宽度呢， 就是说像固定块字号一样，把当前页面的宽度固定住，在调整其它页面宽度时，当前页不受影响。

    在思源里，想满足自己的需求一般两种方法
    365 •
    一种是在思源笔记本身设置里找，另一种是自己写代码，你滴需求估计只能代码满足啦，代码我就不太懂啦
    365 •
  • wilsons • • 1
    付费者 捐赠者

    既然你用过，我就在那个基础上改了下，看看是否你想要的效果。

    暂不支持持久，即文档关闭或页面刷新后复原。

    r122.gif

    代码：

    https://gitee.com/wish163/mysoft/blob/main/%E6%80%9D%E6%BA%90/%E7%BB%99%E4%B8%8D%E5%90%8C%E7%9A%84%E9%A1%B5%E9%9D%A2%E8%AE%BE%E7%BD%AE%E4%B8%8D%E5%90%8C%E7%9A%84%E9%A3%8E%E6%A0%BC.js

    可在 styles 参数里设置风格和描述，可根据自己情况修改

    // 添加风格
const styles = {
    "📋": {tips:'正常', style:``},
    "🛢️": {tips:'数据库', style:`width: 100%!important;margin:0 auto;padding-left:20px!important;padding-right:20px!important;.av{font-size: 16px;}`},
    "🖍️": {tips:'编辑', style:`font-size: 24px!important;.av{font-size: 16px;}`},
    "👁️": {tips:'阅读', style:`font-size: 12px!important;.av{font-size: 16px;}`},
};
    1 回复
    3 引用
    2 操作
    wilsons 在 2025-04-20 07:55:20 更新了该回帖
    wilsons 在 2025-04-20 07:41:19 更新了该回帖
  • carethink •
    作者

    感谢大佬 ~ 这个也太牛了，非常实用，我测试了下，文字的字号大小是没有问题的，但不知道是不是版本的问题，我这边有点小问题，

    1.只能调整页面内文字的大小，如果页面内有数据库，数据库内的字号不受影响。

    2.页面的宽度我这里没有变化， 不知道是什么原因，我尝试把 width 换成了 centerWidth 也还是不行。

    3.这个代码是否也可以实现用快捷键切换字号呀，比如配合 openany， 按快捷键 1 切换数据库字号和宽度，快捷键 2 切换编辑文字的字号和宽度。

    1 回复
  • wilsons •
    付费者 捐赠者

    1.只能调整页面内文字的大小，如果页面内有数据库，数据库内的字号不受影响。

    数据库的字体大小要保持不变，必须设置一个固定值，因为官方默认字体大小是继承祖先或是百分比，比如可在 styles 参数的每个 style 中都加上 .av{font-size: 16px;} 这样的固定值。

    2.页面的宽度我这里没有变化， 不知道是什么原因，我尝试把 width 换成了 centerWidth 也还是不行。

    这一般是你本地因素影响的，width:100%!important 或者 width:100vw!important 试试，如果不行，就多加选择符，或者控制台看看，哪个选择符影响了，只要比它优先级更高就行。

    3.这个代码是否也可以实现用快捷键切换字号呀，比如配合 openany， 按快捷键 1 切换数据库字号和宽度，快捷键 2 切换编辑文字的字号和宽度。

    可以实现最简单的方式就是模拟点击，比如按 alt+1 点击第一个按钮，alt+2 点击第二个等等，可以通过[aria-label="设置编辑风格"]来区分不同的按钮。

    总之，这个代码仅仅是个框架，至于样式不生效全是因为 styles 参数里设置的样式问题，这个因每个人的环境不一样，只能自己去调整。

    建议，先新空间测试，保证没问题后再在自己空间去逐个排查问题。

    2 回复
    3 操作
    wilsons 在 2025-04-19 23:08:12 更新了该回帖
    wilsons 在 2025-04-19 23:01:06 更新了该回帖
    wilsons 在 2025-04-19 22:50:25 更新了该回帖
  • carethink •
    作者

    收到，费心了 哈哈，我再多测试测试~

  • carethink •
    作者

    按照您的分析步骤，我已经调试好了，目前的字体大小问题已经好使(包括数据库)，宽度问题还没有解决，还得麻烦请教您一下，

    1.代码中的 width 我测试发现 是调整块宽度的，我在控制台中看到影响页面宽度的参数是 centerWidth，但是我把 width 替换成 centerWidth 后不好使，无法调整页面宽度，我其实是想调整页面宽度的。

    2.快捷键设置，一会儿我再去仔细学习一下 openany 的贴子。😂

    1 回复
  • wilsons •
    付费者 捐赠者

    1.代码中的 width 我测试发现 是调整块宽度的，我在控制台中看到影响页面宽度的参数是 centerWidth，但是我把 width 替换成 centerWidth 后不好使，无法调整页面宽度，我其实是想调整页面宽度的。

    centerWidth 是什么东西，这不是 css 的属性，是 var(--centerWidth) ? 建议截图看看。

    2.快捷键设置，一会儿我再去仔细学习一下 openany 的贴子。

    哈哈，这是最简单的使用方式了，只需要模拟点击即可，比如

    openAny.setKeymap('alt+3', (event) => {
    event.preventDefault();
    openAny.click('[aria-label="设置数据库风格"]');
});
    1 回复
  • carethink •
    作者

    这个 centerWidth 好像是集市里面"更改编辑器宽度插件"：siyuan-center-Width 的属性，我平时是用这个插件的快捷键,【alt + =】 【alt + -】来修改页面显示宽度的

  • wilsons •
    付费者 捐赠者

    其实和--centerWidth 无关了，还是优先级问题，因为这个插件使用了 #layouts div.layout__center div.protyle-content:not([data-fullwidth="true"]) div.protyle-wysiwyg 选择符，这个优先级太高了。

    所以，我更新了 js 代码，使用了比它更高的优先级，这样就没问题了。

    同时兼容了编辑器宽度插件和思源自适应宽度两种情况。

    你更新代码再试试，只需要在 styles 中修改你的字体大小即可。

    如果想自定义宽度，可以加 width:百分百 %，如果想让编辑器同时居中的话，还需要加 margin:0 auto;

    比如，让编辑器显示 50%，并居中的话；需要加 width:50%;margin:0 auto;

    总之，具体怎样，只需要在 styles 中修改样式即可。

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

    搞定啦~，大佬就是大佬，哈哈，技术强的一批！按您给的代码并结合 OpenAny 代码，最终效果非常完美，再次感谢！

    🎉 恭喜恭喜
    wilsons •
请输入回帖内容 ...
carethink
哈尔滨
回帖
100
 帖子
9
 积分
736

近期热议

推荐标签 标签

  • Chrome

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

    63 引用 • 289 回帖 • 1 关注
  • JWT

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

    20 引用 • 15 回帖 • 27 关注
  • 阿里巴巴

    阿里巴巴网络技术有限公司（简称：阿里巴巴集团）是以曾担任英语教师的马云为首的 18 人，于 1999 年在中国杭州创立，他们相信互联网能够创造公平的竞争环境，让小企业通过创新与科技扩展业务，并在参与国内或全球市场竞争时处于更有利的位置。

    43 引用 • 221 回帖 • 11 关注
  • DNSPod

    DNSPod 建立于 2006 年 3 月份，是一款免费智能 DNS 产品。 DNSPod 可以为同时有电信、网通、教育网服务器的网站提供智能的解析，让电信用户访问电信的服务器，网通的用户访问网通的服务器，教育网的用户访问教育网的服务器，达到互联互通的效果。

    6 引用 • 26 回帖 • 548 关注
  • 尊园地产

    昆明尊园房地产经纪有限公司，即：Kunming Zunyuan Property Agency Company Limited（简称“尊园地产”）于 2007 年 6 月开始筹备，2007 年 8 月 18 日正式成立，注册资本 200 万元，公司性质为股份经纪有限公司，主营业务为：代租、代售、代办产权过户、办理银行按揭、担保、抵押、评估等。

    1 引用 • 22 回帖 • 838 关注
  • 微信

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

    135 引用 • 798 回帖 • 2 关注
  • 游戏

    沉迷游戏伤身，强撸灰飞烟灭。

    188 引用 • 833 回帖 • 2 关注
  • Mac

    Mac 是苹果公司自 1984 年起以“Macintosh”开始开发的个人消费型计算机，如：iMac、Mac mini、Macbook Air、Macbook Pro、Macbook、Mac Pro 等计算机。

    168 引用 • 598 回帖
  • CodeMirror
    2 引用 • 17 回帖 • 197 关注
  • 链滴

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

    记录生活，连接点滴

    203 引用 • 4024 回帖
  • 持续集成

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

    15 引用 • 7 回帖
  • SSL

    SSL（Secure Sockets Layer 安全套接层），及其继任者传输层安全（Transport Layer Security，TLS）是为网络通信提供安全及数据完整性的一种安全协议。TLS 与 SSL 在传输层对网络连接进行加密。

    70 引用 • 193 回帖 • 404 关注
  • webpack

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

    43 引用 • 130 回帖 • 259 关注
  • MySQL

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

    695 引用 • 538 回帖 • 2 关注
  • Outlook
    1 引用 • 5 回帖 • 1 关注
  • CSS

    CSS（Cascading Style Sheet）“层叠样式表”是用于控制网页样式并允许将样式信息与网页内容分离的一种标记性语言。

    200 引用 • 545 回帖
  • Visio
    1 引用 • 2 回帖
  • Ngui

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

    7 引用 • 9 回帖 • 430 关注
  • 程序员

    程序员是从事程序开发、程序维护的专业人员。

    599 引用 • 3541 回帖
  • RIP

    愿逝者安息！

    8 引用 • 92 回帖 • 429 关注
  • TGIF

    Thank God It's Friday! 感谢老天，总算到星期五啦！

    293 引用 • 4496 回帖 • 688 关注
  • JetBrains

    JetBrains 是一家捷克的软件开发公司，该公司位于捷克的布拉格，并在俄国的圣彼得堡及美国麻州波士顿都设有办公室，该公司最为人所熟知的产品是 Java 编程语言开发撰写时所用的集成开发环境：IntelliJ IDEA。

    18 引用 • 54 回帖
  • OkHttp

    OkHttp 是一款 HTTP & HTTP/2 客户端库，专为 Android 和 Java 应用打造。

    16 引用 • 6 回帖 • 99 关注
  • Folo

    Folo 是一个 RSS 阅读和信息聚合应用，整合多种内容源到统一时间线。

    项目地址：https://github.com/RSSNext/Folo

    1 引用 • 3 回帖 • 2 关注
  • GitLab

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

    46 引用 • 72 回帖
  • 链书

    链书（Chainbook）是 B3log 开源社区提供的区块链纸质书交易平台，通过 B3T 实现共享激励与价值链。可将你的闲置书籍上架到链书，我们共同构建这个全新的交易平台，让闲置书籍继续发挥它的价值。

    链书社

    链书目前已经下线，也许以后还有机会重制。

    14 引用 • 258 回帖
  • SQLServer

    SQL Server 是由 [微软] 开发和推广的关系数据库管理系统（DBMS），它最初是由 微软、Sybase 和 Ashton-Tate 三家公司共同开发的，并于 1988 年推出了第一个 OS/2 版本。

    21 引用 • 31 回帖 • 1 关注

最新标签