首页 > 网页设计

SyntaxHighlighter关于滚动条的问题

发布时间:2012-10-09 13:42:24 来源:星知苑 作者:星之宇

SyntaxHighlighter这个是一个高亮插件。现在被用于很多网站的代码显示。

但是SyntaxHighlighter3.0.83,由于自适应宽和高,导致一直有滚动条的问题。

其实这个问题可以修改css文件可以去掉。修改主题文件shCoreDefault.css(默认模版)

 

去掉右侧滚动条:

大概在shCoreDefault.css文件39行位置:

padding:0 !important;[break]

修改为

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

相关合集

  • 女生常用的app有哪些
女生常用的app有哪些

简介:对于女生来说总是有一些自己喜欢的软件,涉及到的方面也是相当的多,有摄影的有美颜的还有一些吃喝玩乐的app,当然也是缺少不了各种各样好玩的游戏的,像是王者啊也是很多的女生都是在玩的,小红书等等一些生活视频知识的软件绝对是少不了的,小编也是做了相对的研究,整理了一些女生必下的手机软件。