在我的博客上,我在一些文章中遇到了一些响应性的问题。结果发现是一些代码片段引起的。
在我的博客上有一些文章,在这些文章中,有一些代码片段超出了正常页面宽度而没有空格。
例如:
cd /some/super/long/super/long/folder
或者其他非常长的命令。
我的博客上的代码片段都是自动添加在 code
标签内,而 code
标签内部又包含了一个 pre
标签。
默认情况下,pre
标签上的 CSS white-space
属性被设置为 normal
。为了解决这个问题,我们将其设置为 pre-wrap
:
pre {
white-space: pre-wrap;
}
当某些单词太长时,它们仍然可能破坏布局。为了解决这个问题,还需添加以下代码:
pre {
word-break: break-all;
}