7
我克隆reveal.js的git仓库,复制JS,CSS,插件和LIB目录/我的家庭-DIR/并创建了r.html
采样页面。语法高亮显示Reveal.js中的代码如何?
在r.html
我有一个<pre><code></code></pre>
块,但它没有突出显示......这是默认的行为,据我所知。我继续前进并更改了reveal.js的初始化以帮助完成此操作,但没有任何更改。 (主题和幻灯片否则)
有什么建议吗?
为r.html
的代码如下:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Reveal.js 3 Slide Demo</title>
<link rel="stylesheet" href="css/reveal.min.css">
<link rel="stylesheet" href="css/theme/default.css" id="theme">
<!--Add support for earlier versions of Internet Explorer -->
<!--[if lt IE 9]>
<script src="lib/js/html5shiv.js"></script>
<![endif]-->
</head>
<body>
<!-- Wrap the entire slide show in a div using the "reveal" class. -->
<div class="reveal">
<!-- Wrap all slides in a single "slides" class -->
<div class="slides">
<!-- ALL SLIDES GO HERE -->
<!-- Each section element contains an individual slide -->
<section>
This is my code
<pre><code>
System.out.println("What is this?");
String p = "this is p";
</code></pre>
</section>
</div>
</div>
<script src="lib/js/head.min.js"></script>
<script src="js/reveal.min.js"></script>
<script>
// Required, even if empty.
Reveal.initialize({
dependencies: [
// Cross-browser shim that fully implements classList - https://github.com/eligrey/classList.js/
{ src: 'lib/js/classList.js', condition: function() { return !document.body.classList; } },
// Interpret Markdown in <section> elements
{ src: 'plugin/markdown/marked.js', condition: function() { return !!document.querySelector('[data-markdown]'); } },
{ src: 'plugin/markdown/markdown.js', condition: function() { return !!document.querySelector('[data-markdown]'); } },
// Syntax highlight for <code> elements
{ src: 'plugin/highlight/highlight.js', async: true, callback: function() { hljs.initHighlightingOnLoad(); } },
// Zoom in and out with Alt+click
{ src: 'plugin/zoom-js/zoom.js', async: true, condition: function() { return !!document.body.classList; } },
// Speaker notes
{ src: 'plugin/notes/notes.js', async: true, condition: function() { return !!document.body.classList; } }
]
});
</script>
</body>
</html>
从火狐“浏览器”控制台日志:
file:///Users/my-home-dir/www/r.html
file:///Users/my-home-dir/www/css/reveal.min.css
file:///Users/my-home-dir/core/www/css/theme/default.css
file:///Users/my-home-dir/www/lib/js/head.min.js
file:///Users/my-home-dir/www/js/reveal.min.js
Unknown pseudo-class or pseudo-element 'selection'. Ruleset ignored due to bad selector. reveal.min.css:7
Unknown property 'hyphens'. Declaration dropped. reveal.min.css:7
Error in parsing value for 'display'. Declaration dropped. reveal.min.css:7
Error in parsing value for 'min-height'. Declaration dropped. reveal.min.css:7
Error in parsing value for 'background'. Declaration dropped. default.css:20
Error in parsing value for 'background'. Declaration dropped. default.css:21
Error in parsing value for 'background'. Declaration dropped. default.css:22
Error in parsing value for 'background'. Declaration dropped. default.css:23
Expected color but found 'center'. Error in parsing value for 'background'. Declaration dropped. default.css:24
Unknown pseudo-class or pseudo-element 'selection'. Ruleset ignored due to bad selector. default.css:34
GET https://fonts.googleapis.com/css [HTTP/1.1 200 OK 20ms]
file:///Users/my-home-dir/www/plugin/highlight/highlight.js
file:///Users/my-home-dir/www/plugin/zoom-js/zoom.js
file:///Users/my-home-dir/www/plugin/notes/notes.js
Error in parsing value for 'width'. Declaration dropped.
我加入'zenburn.css'作为样式表中的一个,并有一些语法高亮....是一个必须? – fiacobelli
添加zenburn也为我固定。 – FacePalm