[英]Code highlighting with semantic-ui
我正在为网站使用semantic-ui,我想知道代码突出显示是否是它支持的实际功能。
整个库的文档页面中都显示了代码块,其中包含突出显示的代码,但我找不到有关如何在项目中使用它的任何详细信息。
在查看了他们页面的源代码后,我尝试创建以下没有突出显示代码的div:
<div class="ui segment">
<div class="ui ignored code" data-type="bash" data-title="commands">
#!/bin/bash
# test
echo 'hello there'
</div>
</div>
还试过包括这个脚本: http : //semantic-ui.com/javascript/library/highlight.min.js
我编码错了还是代码突出显示甚至不是库的一部分?
正如jlukic在这篇文章中所说,他们使用highlight.js库来插入代码。然后你需要初始化initHighlightingOnLoad()
函数来使用他们的代码语法:
hljs.initHighlightingOnLoad();
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/default.min.css"> <script src="https://semantic-ui.com/javascript/library/highlight.min.js"></script> <div class="ui segment"> <pre><code class="bash"> #!/bin/bash # test echo 'hello there' </code></pre> </div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.