事情是这样的,在五一假期的时候我写了一个 Hexo 博客主题 《五一假期,我花了 5 天写了个 Hexo 博客主题》,现在仍然在持续更新与调整(beta 阶段),直到今天我准备把我的博客迁移到新主题时,我发现一个非常奇怪的问题。挠了一下午的头,仍然无法解决一个 css 问题,一直折腾到了现在的晚上 9 点钟,所以在此像询问一下各位 css 大佬能帮我看看这个问题吗?
调 css 是真的痛苦,修好一个地方的样式,另一个地方的样式就崩了,导致我陷入了循环(我 css 太菜了)
问题
如果一篇文章内有代码块,且这个代码块中的代码单行长度(指的是水平长度)比较长(超出了页面的宽度显示范围),这种情况一般来说会有两种解决办法超出时x 轴显示滚动条或自动换行显示,我采用的是显示滚动条。到目前为止没有任何问题,一切正常,在电脑设备上文章主体是正常的,但如果是小屏幕的手机设备就会出现问题
我找到的一个线索是一个 pre 标签,你可以使用这个代码在浏览器控制台快速定位到这个标签
document.querySelector("body > div.container > div > main > article > div.article-content > figure > table > tbody > tr > td.code > pre")
我刚刚找到一个解决办法,就是给 main 标签加一个 css 属性 box-sizing: border-box; 能解决,但还是希望各位大佬能提供一些其它解决办法
如果有大佬解决了这个问题,欢迎到 Lete114/Hexo-Theme-MengD 提交 PR ,或者评论回复我,再此先谢过各位大佬