脚本宝典收集整理的这篇文章主要介绍了SyntaxHighlighter 去掉右侧滚动条的方法，脚本宝典觉得挺不错的，现在分享给大家，也给大家做个参考。

在Chrome浏览器中代码区始终有一个滚动条，firefox不会有这种情况。网上有很多解决方法，修改plugin/syntaxhighlisghter/3.0.81/css目录下shCoredefault.css中的..syntaxhighlighter区域，加上padding:1px;就可以了。

.syntaxhighlighter { 
width: 100% !important; 
margin: 1em 0 1em 0 !important; 
posITion: relative !important; 
overflow: auto !important; 
font-Size: 1em !important; 
padding:1px;/*就是这个*/
} 

下面是其他网友的补充

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，超过自动隐藏。这个方法更美观点，但是不方面查看代码。

到此这篇关于SyntaxHighlighter 去掉右侧滚动条的方法的文章就介绍到这了,更多相关SyntaxHighlighter滚动条内容请搜索脚本宝典以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本宝典！

脚本宝典总结

以上是脚本宝典为你收集整理的SyntaxHighlighter 去掉右侧滚动条的方法全部内容，希望文章能够帮你解决SyntaxHighlighter 去掉右侧滚动条的方法所遇到的问题。

如果觉得脚本宝典网站内容还不错，欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。