2013-11-18 7 views
0

Я ищу варианты для вставки фрагмента кода Java SE в свой документ XHTML. Я нашел Google 'google-code-prettify', но не могу найти шаблонов, которые, по-видимому, лучше всего подходят для отображения фрагментов кода с номерами строк и т. Д. У кого-нибудь был опыт использования google-code-prettify с java-источником или есть еще один плагин Я могу попробовать?XHTML java snippet с Google Довольно печатать

Редактировать: Я обновил свой xhtml, чтобы он в настоящее время выглядит так. Затем я обновил источник prettify.css, чтобы включить код, приведенный ниже в комментариях.

<link href="prettyprint\google-code-prettify\src\prettify.css" type="text/css" rel="stylesheet" /> 
<script type="text/javascript" src="prettyprint\google-code-prettify\src\prettify.js"></script> 

Мой источник java по-прежнему центрирован, а не с отступом слева. Нужно ли мне обновлять файл .js или .css для этого?

Ответ: Я завернул свой pre-тег внутри div, называемого codenippet. Ниже приведен код в css, который исправил это для меня.

#codesnippet li{text-align:left; } 

ответ

0

Вставьте следующий код в свой тег <head>.

<script src="https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js"></script> 

Затем поместите свой код в <pre> теги, как это.

<pre class="prettyprint lang-java linenums"> 
public class Foo { 

    public void bar(){ 
     System.out.println("Foo.bar"); 
    } 

} 
</pre> 

EDIT:

Вот мой CSS.

.pln { color: #000000 } 
.str { color: #DD1144 } 
.kwd { color: #000000; font-weight: bold } 
.com { color: #999988; font-style: italic } 
.typ { color: #445588; font-weight: bold } 
.lit { color: #008080 } 
.pun, .opn, .clo { color: #000000 } 
.tag { color: #080080 } 
.atn { color: #7F0055 } 
.atv { color: #008008 } 
.dec, .var { color: #2A00FF } 
.fun { color: #FF0000 } 
li.L0, li.L1, li.L2, li.L3, li.L4, li.L5, li.L6, li.L7, li.L8, li.L9 { color: #999988; } 
li.L0, li.L2, li.L4, li.L6, li.L8 { background: #F5F5F5; } 

Это оказывает на моей странице вот так.

enter image description here

Надеется, что это помогает.

+0

Код подсвечивается правильно, но его центр и только 1 номер строки (5). Нужно ли использовать пользовательский листок CSS для дальнейшего изменения или что-то еще? – Jason

+0

@Shijima Я опубликовал свой CSS. Убедитесь, что вы изменили цвета в соответствии со стилем вашей страницы. –

+0

Это приближается к тому, что мне нужно. Вместо указания на https для скрипта run_prettify.js я загрузил источник и отредактировал файл pretiffy.css. Цифры теперь идут, но код по-прежнему центрирован и не имеет отступов должным образом. См. Выше, чтобы изменить, как я объявляю в своем xhtml. Есть ли дополнительные изменения, необходимые для исходного файла prettify.css, или вам также нужно что-то изменить в файле .js? – Jason

Смежные вопросы