如何在博客中使用SublimeText风格的代码高亮样式

博客里应用的样式是SublimeText编辑器里面的主题,只需要安装sublime  然后安装,安装sublimehighlight插件

https://github.com/n1k0/SublimeHighlight/tree/python3

线安装的方式,没有成功,可能是因为我的是破解版的软件,直接下载插件包,在github页面将插件的zip文件下载下来

,解压到相应的文件夹下即可:找到SublimeText3的安装路径下的插件包路径(D:\Program Files\Sublime Text3\Data\Packages),将下载下来的文件解压在此即可

打开Sublime Text 3,在菜单栏项点击Preferences可以找到安装好的插件

在解压的文件夹里面有个文件“SublimeHighlight.sublime-settings”,就是用来配置插件属性的,我们可以用Sublime Text 3打开这个文件进行相应的修改。

转子:http://jingyan.baidu.com/article/90808022c1a1d4fd91c80f21.html

吧点击菜单栏“编辑”-->“Highlight”-->“Convert to HTML”,即可生成HTML代码

将生成的HTML代码中div块复制出来,粘贴到我们博客的代码编辑区,就可以实现高亮效果了,这样生成是的内联样式,如果今后想要对博文进行修改,是不会影响到样式的。

例如下面例子

<div class="highlight" style="background: #272822"><pre style="line-height: 125%"><span style="color: #f92672">&lt;?</span><span style="color: #a6e22e">php</span>
    <span style="color: #75715e">// $xml = &quot;&quot;;</span>
    <span style="color: #f8f8f2">$format</span> <span style="color: #f92672">=</span> <span style="color: #e6db74">'There are %d monkeys in the %s'</span><span style="color: #f8f8f2">;</span>
    <span style="color: #f8f8f2">$num</span> <span style="color: #f92672">=</span> <span style="color: #ae81ff">3</span><span style="color: #f8f8f2">;</span>
    <span style="color: #f8f8f2">$location</span> <span style="color: #f92672">=</span> <span style="color: #e6db74">&quot;tree&quot;</span><span style="color: #f8f8f2">;</span>
    <span style="color: #f8f8f2">sprintf($format,</span> <span style="color: #f8f8f2">$num,</span> <span style="color: #f8f8f2">$location);</span>
</pre></div>

<?php

	// $xml = "";
	$format = ‘There are %d monkeys in the %s‘;
	$num = 3;
	$location = "tree";
	sprintf($format, $num, $location);
时间: 2024-10-10 17:22:22

如何在博客中使用SublimeText风格的代码高亮样式的相关文章

如何在博客中使用sublimeText风格的代码样式

1.安装sublimeText 3 2.安装插件sublimehighlight ,简单点其实跟安装其他ST插件是一样的,先Ctrl+Shift+P调出control panel,然后输入install package,不用输完,当输入了Install后便出来了,然后回车等待插件列表的显示,这个过程大概有个几秒钟的样子. 3.如果第2步安装失败,退出刚才的界面重新输入Ctrl+Shift+P调出control panel,输入add repository 选中并回车,这时界面下方会出现输入rep

博客园使用sublime text风格的代码高亮样式

博客园默认显示代码的风格有点丑,于是就想着能不能使用sublime text3的代码高亮,因为本人使用sublime text3编辑C, js, php, html等时,代码高亮的颜色都是本人比较喜欢的.于是就搜到了大神 [刘哇勇] 的博客,按照大神的博客,确实是能设置成功了. 不过设置完成以后,感觉代码的字体和行间距有些不美观.既然都到这一步了,咱们就自己动手,丰衣足食.于是本人首先在div.highlight里设置{font-family:consolas, courier new; lin

博客园Markdown模式的MATLAB代码高亮方案

前言 博客园随笔写作可以使用 Markdown 进行编辑,当展示代码时,可以使用下面的语法来对代码块进行展示: ?```language code-content ?``` 一般来说,指明了 language 后,应该是可以是实现语法高亮的.其基本原理就是将代码中的 关键字 .变量 .函数 等待字符做正则化匹配,将纯文本的代码内容分块,与固定语法内容的着色方案(css样式)对应上. 然鹅!!大部分编程语言都能实现较好的高亮,而 Matlab 效果却很差,语法样式是错误的!看着很不舒服. 就像下面

关于如何在博客中编辑公式的资料

参考例外一篇关于在线公式编辑的文章:http://www.cnblogs.com/haore147/p/3629895.html 好吧,直接试一下才知道: 1. 打开网址:http://latex.codecogs.com/ 2. 输入LaTex代码: f(x)=\frac{1}{\sqrt{2\pi }\sigma } e^{-\frac{(x-\mu )^2}{2\sigma ^2}} 结果如下图: 3.1 切换到源码模式(方法一) 输入:<img src="http://latex.

在hexo静态博客中利用d3-cloud来展现标签云

效果: http://lucyhao.com/tags/ hexo自带的tag cloud的标签展现不太美观,想能够展现出“云”效果的标签.在网上找到了d3-cloud这个项目,github地址:https://github.com/jasondavies/d3-cloud demo地址:https://www.jasondavies.com/wordcloud/ hexo生成的是静态博客,所以最后在网上看到的都是静态的内容,也就是说,我们的看到的标签云也是静态的已经生成好的内容,并不会随着刷新

关于csdn博客中案例效果的动态演示

在以前一篇博文中,网友评论说要是案例效果是动态演示的就好了,我觉得说的很是有道理,因为一个简单的截图不能很好的展示案例效果,要是有一张gif图能动态的播放案例效果就再好不过了.在这里提供一个小软件,用来制作gif图片的.读者可以参考另一篇博文:http://blog.csdn.net/tangcheng_ok/article/details/8246792.这一篇博文也是介绍如何制作gif动态演示图片的.在这里我想做的就是提醒一下大家:在写博文的过程中,如果是上传gif图片,一定要选择无水印,否

查询博客中相同文章类别总共有多少文章

查询博客中相同文章类别总共有多少文章 T_Content 博客表 T_ContentType 博客类别表 string sql = "select  (select  count(*) from T_Content where FTypeId=T.FID) as num from T_ContentType AS T" 查询博客中相同文章类别总共有多少文章

关于完整解答Leo C.W博客中名为“我们公司的ASP.NET 笔试题,你觉得难度如何”的所有题目

关于完整解答Leo C.W博客中名为“我们公司的ASP.NET 笔试题,你觉得难度如何”的所有题目,请大家鉴定,不足之处,敬请指教! 第1到3题解答如下: public enum QuestionType { Text = 0, MultipleChoice = 1 } public interface IQuestion { string Title { get; set; } QuestionType Category { get; } } public abstract class Que

在CSDN博客中插入视频

经过笔者测试,如果想要在CSDN博客中插入视频,在HTML编辑器中写的上传视频的代码(以iframe为例)提交后在文章中是找不到的,不知道为什么没有了,视频也不会显示:在Markdown编辑器中写的上传视频的代码(以iframe为例)提交后在文章中可以找到,同时也会显示视频.