如题,见下图,默认主题。
行内代码过长时奇怪的断行渲染方式
相关帖子
-
默认主题
、
自定义代码
.b3-typography code:not(.hljs), .b3-typography span[data-type~='code'], .protyle-wysiwyg code:not(.hljs), .protyle-wysiwyg span[data-type~='code'] { word-break: break-all; }
@88250 用 word-break: break-all;就能解决这个问题,只不过不会按单词分割,但是我觉得行内代码本身就有底纹,不按单词分割也没什么,是可以明确知道上一行和下一行有没有空格的,不会造成歧义,我自己使用过程中没发现过有所影响。类似的还有超链接。
正文要 break-word 我能理解,但像这种特殊样式,本身就可以靠格式独立出来,break-all 的体验更好其实,我自己用的 Tsundoku 主题就一直用的 break-all。
break-word 反而有时候会莫名奇妙的分行看的还不舒服。因为本身 inline-code、inline-hyperlink,就是行内元素,预期用户输入的就是单行文字,反而因为 break-word 被分割渲染看起来变成了多行。另外,break-word 也不能保证一定按单词分割,行内代码除了代码之外,另一个广泛的用法就是放路径了,对于一般没有空格的长路径,可是直接识别成一个单词的,这时候效果就会很不好,直接前面断了一行。(notion 之类的是不支持直接编辑行内代码左侧,所以问题不太大,而语雀用的就是 break-all)
虽然主题\自定义代码可以做到,不过建议官方考虑一下能否采用这种方案,我是觉得适用于大多数人的,不至于让普通用户困惑。其他用户如果不喜欢 break-all,也可以自定义代码实现 break-word
3 回复 - 其他回帖
-
这个是正好行内代码就在行末尾导致的的吧,应该情况比较少,大家遇到的残留零宽字符更多是在句子中间就被 break word 打断了,非常突兀。我觉得行内代码主要用来标记代码和路径以及数字、字符串,而不是一个长段落,被打断对我而言无所谓,我也更倾向于渲染效果比较规整的结果,一行只有一半就自动换行反而是一件更受不了的事情。如果行内代码的内容没有空格的话,break word 一般都是把整体看成一个单词的,导致过长就直接分行了。
语雀貌似不会有这个问题,不知道怎么实现的。此外语雀的行内代码就是用的 break all,我把它改成 break word,昨天测试的时候并没有发现残留零宽字符
1 回复1 操作Achuan-2 在 2024-04-28 14:16:04 更新了该回帖 - 查看全部回帖
欢迎来到这里!
我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。
注册 关于