SyntaxHighlighter去掉右侧滚动条的方法
短视频,自媒体,达人种草一站服务 SyntaxHighlighter这个是一个高亮插件。现在被用于很多网站的代码显示。但是SyntaxHighlighter3.0.83,由于自适应宽和高,导致一直有滚动条的问题。 在Chrome浏览器中代码区始终有一个滚动条,firefox不会有这种情况。网上有很多解决方法,修改plugin/syntaxhighlisghter/3.0.81/css目录下shCoreDefault.css中的..syntaxhighlighter区域,加上padding:1px;就可以了。 .syntaxhighlighter { 下面是其他网友的补充 SyntaxHighlighter这个是一个高亮插件。现在被用于很多网站的代码显示。但是SyntaxHighlighter3.0.83,由于自适应宽和高,导致一直有滚动条的问题。 其实这个问题可以修改css文件可以去掉。修改主题文件shCoreDefault.css(默认模版) 去掉右侧滚动条: 大概在shCoreDefault.css文件39行位置: padding:0 !important; 修改为: padding: 1px 0 !important; 网上可能是36行 margin: 0 !important;修改为 margin:1px 0 !important;这样修改双击选中后会有错位问题。 去掉下侧的滚动条: 其实我也没有找到两全其美的方法,为什么这么说呢。这里我提供2种方法,但是多有缺陷。 建议:还是输代码的时候注意长度的,只要不超过一定的长度,是不会出现滚动条的。 1.自动换行 .syntaxhighlighter .line { white-space: pre !important; } 修改这个pre为normal的话,前面的行数就会错位。 2.自动隐藏 .syntaxhighlighter { width: 100% !important; margin: 1em 0 1em 0 !important; position: relative !important; overflow: auto !important; font-size: 1em !important; } 修改overflow的auto为hidden,超过自动隐藏。这个方法更美观点,但是不方面查看代码。 (编辑:ASP站长) 【免责声明】本站内容转载自互联网,其相关言论仅代表作者个人观点绝非权威,不代表本站立场。如您发现内容存在版权问题,请提交相关链接至邮箱:bqsm@foxmail.com,我们将及时予以处理。 |
-
无相关信息
- 七彩虹iGame Z390 Vulcan X评测 RGB和护甲都满足
- 华硕PRIME X299-DELUXE II主板测试
- 技嘉Z390 AORUS XTREME评测 兼顾冷和酷,TA是雕
- 微星MPG Z390 GAMING PRO CARBON评测 疾速奔跑
- 华硕ROG STRIX Z390-E GAMING主板测试 极致电竞
- i9-9980XE首发评测 钎焊加持的18核旗舰 功能上天
- ROG Maximus XI GENE评测 当世最厉害M-ATX主板参
- 微星Z390 GAMING PLUS评测 拉风既超值的Z390
- 华硕ROG MAXIMUS XI APEX主板评测 APEX名号的继
- 影驰Z390 GAMER测试 影驰硬件系列四开花?