我正在制作一个jekyll3博客,我正在尝试使用语法荧光笔(添加代码块,我正在使用
highlighter: rouge
markdown: kramdown
由于github页面支持它们。
这是syntax.scss
,注意:我试图限制它的高度并允许垂直/负荷滚动。
.highlight pre {
padding: 10;
background-color: #272822;
border: box;
border-radius: 5px;
max-height:300px;
width: auto;
overflow: auto;
display: block;
margin: 0 0px;
white-space: pre-wrap;
}
.highlight .table-responsive,
.highlight pre,
.highlight .table > tbody > tr > td
{
border: box;
border-radius: 5px;
}
.highlight .table-responsive {
margin-bottom: 0;
}
.highlight .table>tbody>tr>td {
padding: 8px 8px 0 8px;
}
.highlight .lineno {
color: #ccc;
display:inline-block;
padding: 0 5px;
border-right:1px
solid #ccc;
}
.highlight pre code {
display: inline-block;
white-space: pre;
overflow-x: auto;
}
// rest of file is about syntax highlighting rules
这就是我在一些帖子中添加代码文本的方式:
{% highlight java linenos %}
String reverse(String a) {
String result = "";
int l = a.length();
for (int i = 0; i < l; i++) {
result = a.charAt(i) + result;
}
return result;
}
String str = reverse("REDRUM");
System.out.print(str);
String reverse(String a) {
String result = "";
int l = a.length();
for (int i = 0; i < l; i++) {
result = a.charAt(i) + result;
}
return result;
}
String str = reverse("REDRUM");
System.out.print(str);
String reverse(String a) /*this isssssss a veeeeeeeeerrrrrrrrrrrrrrrrrrrrrrry lllllllllong codddddddddde*/ {
String result = "";
int l = a.length();
for (int i = 0; i < l; i++) {
result = a.charAt(i) + result;
}
return result;
}
String str = reverse("REDRUM");
System.out.print(str);
String reverse(String a) {
String result = "";
int l = a.length();
for (int i = 0; i < l; i++) {
result = a.charAt(i) + result;
}
return result;
}
String str = reverse("REDRUM");
System.out.print(str);
{% endhighlight %}
现在,问题是: 如果我没有使用linenos,因此没有显示行号,它就像这张图片,这就是我需要的,用户可以垂直和水平滚动代码:
但是,如果我使用linenos
来显示行号,它看起来像这张图片,这是错误的,每个部分只能单独和垂直滚动:
那么,我应该修改什么来制作我需要的+显示行号?
答案 0 :(得分:1)
我今天遇到了同样的麻烦,考虑用pygments替换你的语法荧光笔。
gem install pygments.rb
# _config.yml
highlighter: pygments