1000字范文,内容丰富有趣,学习的好帮手!
1000字范文 > VScode插件Markdown Preview Enhanced自定义字体style

VScode插件Markdown Preview Enhanced自定义字体style

时间:2019-06-26 15:07:19

相关推荐

VScode插件Markdown Preview Enhanced自定义字体style

文章目录

一、打开 style.less 文件二、修改 style 代码三、修改后的效果补充:更改列表样式Reference

一、打开 style.less 文件

打开命令面板,输入Customize CSS,打开style.less文件

命令面板

style.less文件

二、修改 style 代码

我使用的style.less配置代码如下,你可以根据需要定制自己喜欢的风格

// ====================// issues: /shd101wyy/markdown-preview-enhanced/issues// ====================// ====================// https://shd101wyy.github.io/markdown-preview-enhanced/#/markdown-basics?id=line-numbers// ```cpp {.line-numbers}// a = 3// b = 3// ```// ====================// ====================// /shd101wyy/markdown-preview-enhanced/blob/master/docs/toc.md// You can configure [TOC] and sidebar TOC by writting front-matter// ---// toc:// depth_from: 1// depth_to: 1// ordered: false// ---// ====================// ====================// ====================// ====================// ====================// ====================// ====================// ====================// ====================/* Please visit the URL below for more information: *//* https://shd101wyy.github.io/markdown-preview-enhanced/#/customize-css */ // .markdown-preview.markdown-preview {// modify your style here// eg: background-color: blue;// font-size: 19px; // use systems font// font-family: "{Consolas}";// color: blue; // }// ====================.markdown-preview.markdown-preview {// ===================// ===================// modify your style here// eg: background-color: blue;background-color: #FCFCFC;font-size: 20px;// font-family: "Consolas";font-family: "Medium";// font-family: "新宋体";//// 去掉 toc 前面的小圆点 /shd101wyy/markdown-preview-enhanced/issues/1325ul {list-style-type: none;}h1 {// 标题居中// text-align: center;// border-bottom: 1.5px solid #999999;// font-family: "微软雅黑";font-family: "新宋体";font-size: 28px;// color: rgb(88, 131, 209);}h2 {font-size: 23px;}h3 {font-size: 21px;}// h1, h2, h3, h4, h5, h6 {// font-family: 'Anton';// }// paragraph font// p {// font-family: 'Anton';// }// h1, h2, h3 {// border-bottom: 1px solid #ccc;// }// 取消下划线h1, h2, h3, h4, h5, h6 {border-bottom: none;}// ---下划线粗细hr {height: 0.01em;}/* title numering */// counter-reset: h1;// h1 {//counter-reset: h2// }// h2 {//counter-reset: h3// }// h1:before {//counter-increment: h1;//content: counter(h1) ". "// }// h2:before {//counter-increment: h2;//content: counter(h1) "." counter(h2) ". "// }// custom pdf output style : /shd101wyy/markdown-preview-enhanced/issues/89@media print {font-size: 13px;}}

三、修改后的效果

修改后再次打开 Markdown Preview Enhanced,可以看到字体有了明显的变化,看上去舒服多了

Note:Markdown Preview Enhanced 是可以保证左右两边编辑区和预览区是同步的,即使预览区显示了较大的图片,它会自动把你调整的,这点比CSDN上的markdown编辑器要人性化

补充:更改列表样式

/cssref/pr_list-style-type.asp

/cssref/playit.asp?filename=playcss_ul_list-style-type&preval=circle

ul {list-style-type: circle;// list-style-type: dist;// list-style-type: none;}

Reference

CSS调整字体大小Title and toc autonumbering标题下划线和手动下划线的问题How to center the H1 title ? · Issue #1325 · shd101wyy/markdown-preview-enhanced

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。