2019 Jun. 30.
2019 May 02.
2019 Feb 08.
参照元
https://torina.top/detail/460/
http://labs.kamimoto.biz/javascript/google-code-prettify-linenums.html
<script src="https://cdn.rawgit.com/google/code-prettify/master/loader/run_prettify.js"></script><style>
.prettyprint ol.linenums > li {
list-style-type: decimal;
}
pre.prettyprint {
white-space: pre;
overflow: auto;
}
</style>
<pre class="prettyprint linenums">
コンテンツ1
</pre>
<pre class="prettyprint linenums">
コンテンツ2
</pre>
list-style-type: decimal;
}
</style>
<pre class="prettyprint linenums">
YOUR CODE HERE
</pre>
<style>
pre.prettyprint {
white-space: pre;
overflow: auto;
}
</style>
<pre class="prettyprint linenums">
YOUR CODE HERE
</pre>
2019 May 02.
2019 Feb 08.
参照元
https://torina.top/detail/460/
http://labs.kamimoto.biz/javascript/google-code-prettify-linenums.html
・HTML編集モードで編集する。
・記述するタグ
- <script></script> ページ先頭に記述
- <style></style> 行番号・スクロールバー設定
- <pre class="prettyprint linenums"></pre> 本文記述
・HTML構成
<script src="https://cdn.rawgit.com/google/code-prettify/master/loader/run_prettify.js"></script><style>.prettyprint ol.linenums > li {
list-style-type: decimal;
}
pre.prettyprint {
white-space: pre;
overflow: auto;
}
</style>
<pre class="prettyprint linenums">
コンテンツ1
</pre>
<pre class="prettyprint linenums">
コンテンツ2
</pre>
・行番号表示
<script src="https://cdn.rawgit.com/google/code-prettify/master/loader/run_prettify.js"></script>
<style>
.prettyprint ol.linenums > li {list-style-type: decimal;
}
</style>
<pre class="prettyprint linenums">
YOUR CODE HERE
</pre>
・横スクロールバー
<script src="https://cdn.rawgit.com/google/code-prettify/master/loader/run_prettify.js"></script><style>
pre.prettyprint {
white-space: pre;
overflow: auto;
}
</style>
<pre class="prettyprint linenums">
YOUR CODE HERE
</pre>