为知笔记如何自定义标题样式

为知笔记的原生标题样式我感觉不太好直接区分是几级标题,查阅了一些资料,这里自定义一下。

修改css文件,位置:

C:\Program Files (x86)\WizNote\WizTools\htmleditor\pcCustom.css,这是给用户自定义css的,修改后会覆盖default.css

参考谷歌的色彩设置标题,这里我设置到四级标题。

.wiz-editor-body h1 {
	font-size: 20px;
	font-size: 1.7rem;
	background: #4285F4   !important;
	border-radius: 6px 6px 6px 6px !important;
	color: #FFFFFF;
	font-family: "微软雅黑" , "宋体" , "黑体" ,Arial;
	font-weight: bold;
	line-height: 35px;
	margin: 15px 0 !important;
	padding: 5px 0 5px 20px;
	text-shadow: 2px 2px 3px #222222;
 
}

.wiz-editor-body h2 {
	font-size: 18pt;
	font-size: 1.5rem;
	padding-right: 64px;
    padding-left: 10px;
    border-left-width: 3px;
    border-left-style: solid;
    border-left-color: #FBBC05;
    line-height: 1.2;
 
}

.wiz-editor-body h3 {
	font-size: 15pt;
	font-size: 1.25rem;
	color: #34A853;
    font-weight: bold;
    border-bottom: 1px solid #ddd;
    margin-bottom: 15px;
}


.wiz-editor-body h4 {
	font-size: 14pt;
	font-size: 1.17rem;
	color: #EA4335;
}

效果如下,perfect!

 

大T笔记所有文章均为本人原创,转载请您注明来源,并留下原文链接地址,是对我的尊重,也是对知识的尊重,谢谢!
大T笔记 » 为知笔记如何自定义标题样式

大T笔记-我的个人互联网创业和自由职业之路

关于我 我的百宝箱
大T笔记-专注个人互联网创业和自由职业