简体   繁体   English

用Markdown写html标签?

[英]Write html tag with Markdown?

In tumblr, markdown is supported. 在tumblr中,支持降价。 I try to add a syntax high lighter( highlight.js ) in my tumblr, but got some problem. 我尝试在我的tumblr中添加一个高亮度highlight.js )的语法,但是遇到了一些问题。

highlight.js need adding a class attribute in HTML code tag. highlight.js需要在HTML代码标记中添加一个属性。

I try to write a article like this in my tumblr : 我试着在我的tumblr中写一篇这样的文章:

<pre class="test">
    <code class="html">
        function A(){ return "hello world"; }
    </code>
</pre>

The result in real page: 实际页面中的结果:

<pre>
    <code>
        function A(){ return "hello world"; }
    </code>
</pre>

The class attribute is gone...... Is there possible adding a HTML attribute in Markdown? class属性消失了......是否有可能在Markdown中添加HTML属性?

If you use google-code-prettify , you could do this (I am currently doing this): 如果你使用google-code-prettify ,你可以这样做(我目前正在这样做):

$(document).ready(function() {
    $('pre').addClass('prettyprint');
    prettyPrint();
});

Basically, you load all the files: 基本上,您加载所有文件:

prettify.css
sunburst.css // optional styles
prettify.js

Add the code snippet above, and call prettyPrint onLoad : onload="prettyPrint()" . 添加上面的代码片段,并调用prettyPrint onLoadonload="prettyPrint()"

The code snippet above should go before all the files. 上面的代码片段应该在所有文件之前。 It finds all pre elements, and appends the prettyprint class to it so that the script knows to style it. 它找到所有pre元素,并将prettyprint类附加到它,以便脚本知道它的样式。


If, however, you wanted to use your current syntax highlighter, you could do something like this (using jQuery): 但是,如果您想使用当前语法高亮显示器,则可以执行以下操作(使用jQuery):

$(document).ready(function() {
    $('pre').addClass('test');
    $('code').addClass('html');
    // code to intialize highlight.js
});

I just tried, it was not difficult. 我刚试过,这并不困难。

http://softwaremaniacs.org/soft/highlight/en/description/ describes in the first code snippet what you need to plug into the html of your tumblr page to make it work. http://softwaremaniacs.org/soft/highlight/en/description/在第一个代码片段中描述了插入tumblr页面的html以使其工作所需的内容。 The code snippet will not load with highlighting in the preview mode. 在预览模式下,代码段不会加载突出显示。

To be able to use the highlighter you need to be able to link the stylesheet and the javascript. 为了能够使用荧光笔,您需要能够链接样式表和javascript。 If you don't have hosting then the guys of highlight.js offer a hosted solution for free. 如果你没有托管,那么highlight.js的人就可以免费提供托管解决方案。

Add these 3 lines inside your <head>...</head> tags <head>...</head>标记内添加这3行

<link rel="stylesheet" href="http://yandex.st/highlightjs/7.2/styles/default.min.css">
<script src="http://yandex.st/highlightjs/7.2/highlight.min.js"></script>
<script>hljs.initHighlightingOnLoad();</script>

All I added to my code post on the tumblr was 我添加到tumblr上的代码中的所有内容都是

<pre><code class="language-python">
...your code here...
</code></pre>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM