请注意,本文编写于 2108 天前,最后修改于 1502 天前,其中某些信息可能已经过时。
本文目的为记录各种特殊输出的情况,留备后用。
文章中插入按钮
- 矩形文字按钮
- 椭圆形文字按钮
- 矩形图标文字按钮
//editormdSupport.js
function editormdSupport() {
//使 EditorMD 的样式能应用于文章
$('#post-content .entry-content').addClass('editormd-html-preview');
//为每一行添加 li 标签以应用行标和奇偶行异色效果
$('pre code').each(function() {
var codeClass = $(this).attr('class');
var codeTxt = $(this).html().split("\n");
var finalHtml = '<ol class="linenums">';
var lCnt = 0;
for (var i = 0; i < codeTxt.length; i++) {
finalHtml += '<li class="L' + lCnt + '"><code class="' + codeClass + '">' + codeTxt[i] + '</code></li>';
if (++lCnt >= 10) lCnt = 0;
}
finalHtml += '</ol>';
var pre = $(this).parent('pre');
pre.addClass('prettyprint linenums prettyprinted');
pre.html(finalHtml);
});
//调整 ol 宽度,解决每行底色覆盖不全问题
$('pre ol.linenums').each(function() {
var codes = $(this).find('code');
var maxWidth = 0;
$(codes).each(function() {
var width = $(this).width();
if (width > maxWidth) maxWidth = width;
});
$(this).width(maxWidth);
});
}
[button]矩形按钮文字[/button]
[button color="success"]矩形按钮文字[/button]
[button type="round" color="success"]椭圆形按钮文字[/button]
[button color="success"color="success"color="success"color="success"color="success"color="success" icon="glyphicon glyphicon-eur"]图标按钮文字[/button]