剪藏知乎遇到链接会换行

[Jiangshuon]

Is there an existing issue for this?

• I have searched the existing issues

Can the issue be reproduced with the default theme (daylight/midnight)?

• I was able to reproduce the issue with the default theme

Could the issue be due to extensions?

• I've ruled out the possibility that the extension is causing the problem.

Describe the problem

Expected result

。。

Screenshot or screen recording presentation

No response

Version environment

- Version: 最新
- Operating System: win11
- Browser (if used):

Log file

。。

More information

No response

[TCOTC]

截图看一下剪藏拓展的实验性选项

[Jiangshuon]

哦哦，是那个选项的问题，关了就好了，不过印象中我没有主动打开过

[TCOTC]

截图看看是什么选项

[Jiangshuon]

span那个选项

[TCOTC]

补充一个加粗后换行：https://ld246.com/article/1742444193305

网页：https://mp.weixin.qq.com/s/Ie3gq3k81c5B-L7uH2h9PQ

[TCOTC]

https://ld246.com/article/1742444193305/comment/1742451059224#comments

[ruin1990]

正好是个span，然后继承了p的white-space: normal;以及.rich_media_content * 的word-wrap: break-word !important;
实际渲染没换行
这个逻辑我刚才查阅资料和问了一下AI

排查 overflow 设置
若父级有 overflow: hidden，可能隐藏换行效果。
检查是否有 text-overflow: ellipsis 截断文本。

重新确认了下样式，可是样式是灰的，去掉这部分也没有换行

[88250]

https://ld246.com/article/1742444193305/comment/1742451059224#comments

我这里测试正常：

[TCOTC]

回帖里的书名号前面那个换行是正常的

[88250]

回帖里的书名号前面那个换行是正常的

也就是说没有问题？

[TCOTC]

[88250]

明白了

[88250]

可能和 #14400 (comment) 这个类似吧

@ruin1990 你再看看这个例子是否有共同点？

[ruin1990]

@TCOTC 请问下，这个测试网页在哪，好像不是https://mp.weixin.qq.com/s/Ie3gq3k81c5B-L7uH2h9PQ
原文里应该楼主只给了对应的html段，不过style没有完整的，无法分析
如果是提供文章链接的地方（比如同一个公众号），应该是同一个问题@88250

这里我想知道究竟是啥style覆盖了span的换行style

[TCOTC]

https://mp.weixin.qq.com/s/M1f0tfw_pAIY8RwsLu12lA

[ruin1990]

好的感谢提供，看了下最终的计算样式，display:inline
但是我和以前span换行问题的网页对比，
看起来是一样的样式，为什么结果表现一个span有换行，一个没有，我还需要再看看

[ruin1990]

似乎依赖于非tag样式里的自然换行符（\n）

[88250]

有需要我这边支持的地方吗？

[ruin1990]

有需要我这边支持的地方吗？

嗯，这个没发现换行和不换行的样式差异在哪。就没法添加逻辑判断是否换行

[88250]

@Vanessa219 抽空帮看看这个问题

[Vanessa219]

span 一般都不换行，https://www.bilibili.com/opus/465490977904921957 中的换行只和 white-space: pre-wrap; 这个相关，https://mp.weixin.qq.com/s/M1f0tfw_pAIY8RwsLu12lA 中的
word-wrap: break-word 并不会导致换行。

[ruin1990]

@Vanessa219 您好，我有个疑惑就是我如果手动修改网页样式，把 https://mp.weixin.qq.com/s/M1f0tfw_pAIY8RwsLu12lA 中的样式调整成和 https://www.bilibili.com/opus/465490977904921957 一样，也并没有换行。
会不会也和原始网页中有\n有关，如果有pre-wrap或者pre节点的时候换行依赖于\r\n?

所以我又修改了下原文，如果在对应span节点后手动增加一些换行符(不是<br>，是\r\n)，反而能换行了

span 一般都不换行，https://www.bilibili.com/opus/465490977904921957 中的换行只和 white-space: pre-wrap; 这个相关，https://mp.weixin.qq.com/s/M1f0tfw_pAIY8RwsLu12lA 中的 word-wrap: break-word 并不会导致换行。

[Vanessa219]

可以参考一下 https://developer.mozilla.org/zh-CN/docs/Web/CSS/white-space

[ruin1990]

感谢提供的资料，看来和换行符也有关系
那可能需要根据样式批量合并换行符以及替换为<br>才能正确地识别到span的换行

	换行符	空格和制表符	文本换行	行末空格	行末的其他空白分隔符
normal	合并	合并	换行	移除	挂起
nowrap	合并	合并	不换行	移除	挂起
pre	保留	保留	不换行	保留	不换行
pre-wrap	保留	保留	换行	挂起	挂起
pre-line	保留	合并	换行	移除	挂起
break-spaces	保留	保留	换行	换行	换行

[88250]

好复杂，具体需要做些什么？