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

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

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

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

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

    26333 引用 • 109508 回帖 • 1 关注
  • Q&A

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

    10125 引用 • 46012 回帖 • 63 关注

相关帖子

被采纳的回答

欢迎来到这里!

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

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

    😭

  • suxiang999

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

  • suxiang999

    image.png

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

    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 via macOS
    作者

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

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

  • carethink via macOS
    作者

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

  • carethink via macOS
    作者

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

  • carethink via macOS
    作者

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

    1 回复
  • carethink via macOS
    作者

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

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

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

    在思源里,想满足自己的需求一般两种方法
    suxiang999
    一种是在思源笔记本身设置里找,另一种是自己写代码,你滴需求估计只能代码满足啦,代码我就不太懂啦
    suxiang999
  • 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 回复
    2 操作
    wilsons 在 2025-04-20 07:55:20 更新了该回帖
    wilsons 在 2025-04-20 07:41:19 更新了该回帖
  • carethink via macOS
    作者

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

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

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

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

    1 回复
  • 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 via macOS
    作者

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

  • carethink via macOS
    作者

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

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

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

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

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

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

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

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

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

  • 其实和--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 评论 via macOS
    作者

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

    🎉 恭喜恭喜
    wilsons
请输入回帖内容 ...

推荐标签 标签

  • 代码片段

    代码片段分为 CSS 与 JS 两种代码,添加在 [设置 - 外观 - 代码片段] 中,这些代码会在思源笔记加载时自动执行,用于改善笔记的样式或功能。

    用户在该标签下分享代码片段时需在帖子标题前添加 [css] [js] 用于区分代码片段类型。

    202 引用 • 1466 回帖 • 1 关注
  • ReactiveX

    ReactiveX 是一个专注于异步编程与控制可观察数据(或者事件)流的 API。它组合了观察者模式,迭代器模式和函数式编程的优秀思想。

    1 引用 • 2 回帖 • 178 关注
  • DNSPod

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

    6 引用 • 26 回帖 • 533 关注
  • 前端

    前端技术一般分为前端设计和前端开发,前端设计可以理解为网站的视觉设计,前端开发则是网站的前台代码实现,包括 HTML、CSS 以及 JavaScript 等。

    246 引用 • 1338 回帖
  • V2EX

    V2EX 是创意工作者们的社区。这里目前汇聚了超过 400,000 名主要来自互联网行业、游戏行业和媒体行业的创意工作者。V2EX 希望能够成为创意工作者们的生活和事业的一部分。

    16 引用 • 236 回帖 • 242 关注
  • SSL

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

    70 引用 • 193 回帖 • 408 关注
  • PHP

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

    167 引用 • 408 回帖 • 485 关注
  • Ant-Design

    Ant Design 是服务于企业级产品的设计体系,基于确定和自然的设计价值观上的模块化解决方案,让设计者和开发者专注于更好的用户体验。

    17 引用 • 23 回帖 • 2 关注
  • 倾城之链
    23 引用 • 66 回帖 • 166 关注
  • WebComponents

    Web Components 是 W3C 定义的标准,它给了前端开发者扩展浏览器标签的能力,可以方便地定制可复用组件,更好的进行模块化开发,解放了前端开发者的生产力。

    1 引用 • 15 关注
  • Shell

    Shell 脚本与 Windows/Dos 下的批处理相似,也就是用各类命令预先放入到一个文件中,方便一次性执行的一个程序文件,主要是方便管理员进行设置或者管理用的。但是它比 Windows 下的批处理更强大,比用其他编程程序编辑的程序效率更高,因为它使用了 Linux/Unix 下的命令。

    125 引用 • 74 回帖 • 1 关注
  • Elasticsearch

    Elasticsearch 是一个基于 Lucene 的搜索服务器。它提供了一个分布式多用户能力的全文搜索引擎,基于 RESTful 接口。Elasticsearch 是用 Java 开发的,并作为 Apache 许可条款下的开放源码发布,是当前流行的企业级搜索引擎。设计用于云计算中,能够达到实时搜索,稳定,可靠,快速,安装使用方便。

    117 引用 • 99 回帖 • 197 关注
  • H2

    H2 是一个开源的嵌入式数据库引擎,采用 Java 语言编写,不受平台的限制,同时 H2 提供了一个十分方便的 web 控制台用于操作和管理数据库内容。H2 还提供兼容模式,可以兼容一些主流的数据库,因此采用 H2 作为开发期的数据库非常方便。

    11 引用 • 54 回帖 • 671 关注
  • IBM

    IBM(国际商业机器公司)或万国商业机器公司,简称 IBM(International Business Machines Corporation),总公司在纽约州阿蒙克市。1911 年托马斯·沃森创立于美国,是全球最大的信息技术和业务解决方案公司,拥有全球雇员 30 多万人,业务遍及 160 多个国家和地区。

    17 引用 • 53 回帖 • 143 关注
  • 单点登录

    单点登录(Single Sign On)是目前比较流行的企业业务整合的解决方案之一。SSO 的定义是在多个应用系统中,用户只需要登录一次就可以访问所有相互信任的应用系统。

    9 引用 • 25 回帖 • 2 关注
  • TGIF

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

    291 引用 • 4495 回帖 • 663 关注
  • 电影

    这是一个不能说的秘密。

    123 引用 • 608 回帖 • 1 关注
  • VirtualBox

    VirtualBox 是一款开源虚拟机软件,最早由德国 Innotek 公司开发,由 Sun Microsystems 公司出品的软件,使用 Qt 编写,在 Sun 被 Oracle 收购后正式更名成 Oracle VM VirtualBox。

    10 引用 • 2 回帖 • 16 关注
  • GitHub

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

    209 引用 • 2040 回帖
  • Openfire

    Openfire 是开源的、基于可拓展通讯和表示协议 (XMPP)、采用 Java 编程语言开发的实时协作服务器。Openfire 的效率很高,单台服务器可支持上万并发用户。

    6 引用 • 7 回帖 • 120 关注
  • MySQL

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

    694 引用 • 537 回帖
  • Netty

    Netty 是一个基于 NIO 的客户端-服务器编程框架,使用 Netty 可以让你快速、简单地开发出一个可维护、高性能的网络应用,例如实现了某种协议的客户、服务端应用。

    49 引用 • 33 回帖 • 43 关注
  • 微信

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

    133 引用 • 796 回帖
  • C

    C 语言是一门通用计算机编程语言,应用广泛。C 语言的设计目标是提供一种能以简易的方式编译、处理低级存储器、产生少量的机器码以及不需要任何运行环境支持便能运行的编程语言。

    86 引用 • 165 回帖
  • 大数据

    大数据(big data)是指无法在一定时间范围内用常规软件工具进行捕捉、管理和处理的数据集合,是需要新处理模式才能具有更强的决策力、洞察发现力和流程优化能力的海量、高增长率和多样化的信息资产。

    89 引用 • 113 回帖
  • WebSocket

    WebSocket 是 HTML5 中定义的一种新协议,它实现了浏览器与服务器之间的全双工通信(full-duplex)。

    48 引用 • 206 回帖 • 280 关注
  • 招聘

    哪里都缺人,哪里都不缺人。

    188 引用 • 1057 回帖 • 2 关注