为WP-B2主题的代码块增加高度限制

上次为WP-B2主题增加代码块的复制按钮后,发现如果是几百行的代码块会导致文章非常的长,所以就有了这次的优化

优化前后的对比

为WP-B2主题的代码块增加高度限制

为WP-B2主题的代码块增加高度限制

将以下代码放入到主题的style.css文件中,建议使用子主题

要增加代码块的高度并添加滚动条,可以通过修改现有的CSS样式来实现。以下是具体的步骤和代码示例:

修改CSS样式

  1. 增加代码块的高度
    • 可以通过设置 .code-toolbar pre 的 max-height 属性来限制代码块的最大高度。
    • 使用 overflow-y 属性来添加垂直滚动条。
  2. 调整工具栏按钮的边框半径
    • 修正 .toolbar-item button 中 border-radius 属性的值。

以下是修改后的CSS代码:

直接替换即可

给TA打赏
共{{data.count}}人
人已打赏
未分类技术

WP多站点使用Redis串站问题解决办法

2025-9-20 13:56:12

未分类技术

为你的 Linux 服务器开启 BBR,大幅提升网络性能!

2025-9-22 6:29:11