行内代码过长时奇怪的断行渲染方式

本贴最后更新于 238 天前,其中的信息可能已经时移世易

如题,见下图,默认主题。

图片.png

  • 思源笔记

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

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

    23006 引用 • 92540 回帖

相关帖子

欢迎来到这里!

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

注册 关于
请输入回帖内容 ...
  • 我试了下好像不行,还是会有残留的零宽字符在上面。单词被隔断看着很不舒服。

    image.png

    2 回复
  • 其他回帖
  • 3Woods 3 评论

    即便行内代码不在末尾也会有这个问题 😂 。

    图片.png

    楼主中的图片和 issue 中说的应该是残留问题,这个调整编辑器宽度应该可以重现。代码里面大部分都是英文,截断感觉会影响阅读。

    另外也不光是残留的问题,虽然调整宽度可以避免断行,但是在屏幕大小限制(比如移动端),或者需要导出 pdf 时很影响排版美观。😭

    你应该回复 V 姐的,我回复她的那个是说用 break-all 语法为什么也会出现残留零宽字符,用 break-word 就是可能会把行内代码识别为一个单词不打断导致分行。 确实需要的话把我前面的 css 代码片段加入外观设置就好了
    Achuan-2
    JeffreyChen
    导出的时候可以处理一下。移动端估计就没有办法了
    Vanessa
  • Achuan-2 1 赞同

    break all 和 break-word 在中文场景下区别不大,英文场景下才有区别。我之前之所以给主题的超链接加 break-all,主要是因为也是有行内代码的问题,如果一个链接的长锚文本被识别一个单词,就会直接与普通文本分行,特别难受。

    Clip20240427232432.png

    如果是普通段落,其实 break-word 就还可以。

    Clip20240427224812.png

    3 操作
    Achuan-2 在 2024-04-27 23:25:09 更新了该回帖
    Achuan-2 在 2024-04-27 23:07:45 更新了该回帖
    Achuan-2 在 2024-04-27 23:04:47 更新了该回帖
  • Achuan-2 1 1 赞同 3 评论

    我看了下语雀的 DOM 结构,发现语雀的零宽字符是单独用 span 标签包裹的

    image.png

    而使用的零宽字符直接就放在了内容的最左侧

    估计是这个原因,break-word 识别零宽字符是一个单词,后面的长字符串为一个单词,然后就被分割了。不知道思源有没有办法改进下。

    Clip20240428221652.png

    我发现估计是使用的零宽字符的缘故,V 姐试试改用语雀的那种零宽字符,我直接在 DOM 改零宽字符貌似就没有出现残留了!

    @Vanessa

    修改语雀 DOM 用思源的零宽字符,也会出现这个问题

    Clip20240428223517.png

    思源改之前

    Clip20240428223912.png

    改之后

    Clip20240428224011.png

    确实就不会在上一行残留一点点背景了,但是貌似发现了一个缺点——下一行好像会多一个字,语雀由于是 break-all 就没有这个问题

    1 回复
    DOM 结构改不了了。
    Vanessa
    @Vanessa 零宽字符能改吗 我的意思是改成语雀的零宽字符
    Achuan-2
    @Achuan-2 可以改的,但是用的地方比较多,还需要看其他地方有没有问题。我先建个 issue Issue #11248 · siyuan-note/siyuan
    Vanessa
  • 查看全部回帖

推荐标签 标签

  • 导航

    各种网址链接、内容导航。

    42 引用 • 175 回帖
  • iOS

    iOS 是由苹果公司开发的移动操作系统,最早于 2007 年 1 月 9 日的 Macworld 大会上公布这个系统,最初是设计给 iPhone 使用的,后来陆续套用到 iPod touch、iPad 以及 Apple TV 等产品上。iOS 与苹果的 Mac OS X 操作系统一样,属于类 Unix 的商业操作系统。

    85 引用 • 139 回帖
  • 脑图

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

    30 引用 • 96 回帖
  • 生活

    生活是指人类生存过程中的各项活动的总和,范畴较广,一般指为幸福的意义而存在。生活实际上是对人生的一种诠释。生活包括人类在社会中与自己息息相关的日常活动和心理影射。

    230 引用 • 1454 回帖
  • JavaScript

    JavaScript 一种动态类型、弱类型、基于原型的直译式脚本语言,内置支持类型。它的解释器被称为 JavaScript 引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在 HTML 网页上使用,用来给 HTML 网页增加动态功能。

    728 引用 • 1273 回帖 • 2 关注
  • 链滴

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

    记录生活,连接点滴

    156 引用 • 3792 回帖
  • Rust

    Rust 是一门赋予每个人构建可靠且高效软件能力的语言。Rust 由 Mozilla 开发,最早发布于 2014 年 9 月。

    58 引用 • 22 回帖
  • 博客

    记录并分享人生的经历。

    273 引用 • 2388 回帖
  • Hprose

    Hprose 是一款先进的轻量级、跨语言、跨平台、无侵入式、高性能动态远程对象调用引擎库。它不仅简单易用,而且功能强大。你无需专门学习,只需看上几眼,就能用它轻松构建分布式应用系统。

    9 引用 • 17 回帖 • 612 关注
  • BookxNote

    BookxNote 是一款全新的电子书学习工具,助力您的学习与思考,让您的大脑更高效的记忆。

    笔记整理交给我,一心只读圣贤书。

    1 引用 • 1 回帖
  • 支付宝

    支付宝是全球领先的独立第三方支付平台,致力于为广大用户提供安全快速的电子支付/网上支付/安全支付/手机支付体验,及转账收款/水电煤缴费/信用卡还款/AA 收款等生活服务应用。

    29 引用 • 347 回帖 • 5 关注
  • 工具

    子曰:“工欲善其事,必先利其器。”

    288 引用 • 734 回帖
  • Sym

    Sym 是一款用 Java 实现的现代化社区(论坛/BBS/社交网络/博客)系统平台。

    下一代的社区系统,为未来而构建

    524 引用 • 4601 回帖 • 700 关注
  • Ngui

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

    7 引用 • 9 回帖 • 394 关注
  • Flutter

    Flutter 是谷歌的移动 UI 框架,可以快速在 iOS 和 Android 上构建高质量的原生用户界面。 Flutter 可以与现有的代码一起工作,它正在被越来越多的开发者和组织使用,并且 Flutter 是完全免费、开源的。

    39 引用 • 92 回帖 • 7 关注
  • CAP

    CAP 指的是在一个分布式系统中, Consistency(一致性)、 Availability(可用性)、Partition tolerance(分区容错性),三者不可兼得。

    11 引用 • 5 回帖 • 612 关注
  • GitLab

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

    46 引用 • 72 回帖
  • Hexo

    Hexo 是一款快速、简洁且高效的博客框架,使用 Node.js 编写。

    21 引用 • 140 回帖 • 3 关注
  • BAE

    百度应用引擎(Baidu App Engine)提供了 PHP、Java、Python 的执行环境,以及云存储、消息服务、云数据库等全面的云服务。它可以让开发者实现自动地部署和管理应用,并且提供动态扩容和负载均衡的运行环境,让开发者不用考虑高成本的运维工作,只需专注于业务逻辑,大大降低了开发者学习和迁移的成本。

    19 引用 • 75 回帖 • 653 关注
  • RYMCU

    RYMCU 致力于打造一个即严谨又活泼、专业又不失有趣,为数百万人服务的开源嵌入式知识学习交流平台。

    4 引用 • 6 回帖 • 51 关注
  • JVM

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

    180 引用 • 120 回帖 • 2 关注
  • 单点登录

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

    9 引用 • 25 回帖
  • Redis

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

    286 引用 • 248 回帖 • 44 关注
  • sts
    2 引用 • 2 回帖 • 197 关注
  • OnlyOffice
    4 引用 • 2 关注
  • danl
    146 关注
  • OAuth

    OAuth 协议为用户资源的授权提供了一个安全的、开放而又简易的标准。与以往的授权方式不同之处是 oAuth 的授权不会使第三方触及到用户的帐号信息(如用户名与密码),即第三方无需使用用户的用户名与密码就可以申请获得该用户资源的授权,因此 oAuth 是安全的。oAuth 是 Open Authorization 的简写。

    36 引用 • 103 回帖 • 17 关注