博客园主题美化
本文主题样式来源:https://www.cnblogs.com/niceyoo/
美化方法
博客园Silence主题:http://esofar.gitee.io/cnblogs-theme-silence/#/ 使用自定义的样式
美化步骤
博客园美化本质是修改页面的样式,所以只需将自定义样式替换掉博客园自带原生的样式即可。博客园的样式修改需要在管理后台进行设置。
修改博客皮肤
博客皮肤选择Custom
,修改样式需要开通JS权限,所以在进行下面的步骤前,需要先开通JS权限。
![修改博客皮肤](https://gitee.com/cjiayang/picgo-img/raw/master/img/image-20220119171501275.png)
禁用博客园模板CSS样式
勾选禁用模板默认CSS
![禁用默认CSS](https://gitee.com/cjiayang/picgo-img/raw/master/img/image-20220119171853667.png)
添加自定义CSS
在博客侧边栏公告中,填写以下代码,最后点击保存即可。
<style>article,aside,blockquote,body,button,code,dd,details,div,dl,dt,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,hr,input,legend,li,menu,nav,ol,p,pre,section,td,textarea,th,ul{margin:0;padding:0}html{font-family:-apple-system,system-ui,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Hiragino Sans GB,Microsoft YaHei,Arial,sans-serif;text-rendering:optimizeLegibility;scroll-behavior:smooth}a{color:inherit;cursor:pointer}a,a:hover,a:link,a:visited{text-decoration:none!important}ol,ul{list-style:none}::-moz-selection{background:var(--themeColor,#00a1d6);color:var(--text-a,#fff)}::selection{background:var(--themeColor,#00a1d6);color:var(--text-a,#fff)}.fireworks{display:none}</style>
<style media="screen and (min-width:0px)">@import url(https://cdn.jsdelivr.net/npm/font-awesome/css/font-awesome.min.css);</style><style media="screen and (min-width:0px)">@import url(https://at.alicdn.com/t/font_438759_kmvtb0te1nd.css);</style><style media="screen and (min-width:0px)">@import url(https://at.alicdn.com/t/font_828218_h7s2khrqx1w.css);</style><style>#home{display:block}#back2Top,#top_nav{display:none}#back2Top{position:fixed;bottom:2rem;right:1.5rem}#back2Top .icon{height:2rem}#blogTitle{padding:40px 20px 10px;background-image:url(https://img2018.cnblogs.com/blog/1489774/201911/1489774-20191115181738072-2067895519.jpg);background-position:50%;background-size:cover}#blogLogo{width:80px;height:80px;background-image:url(https://pic.cnblogs.com/avatar/1489774/20190708183140.png);background-size:contain;border-radius:50%;border:4px solid #fff}html{--ThemeColor:#00a1d6;--ThemeColorDark:#2d6dca;--AidColor1:#fa7d00;--AidColor2:#ff2e2e;--AidColor3:#36c67d;--TextColor1:#141418;--TextColor2:#5f5f6b;--TextColor3:#97979f;--DividColor:#e7eaf0;--BlockColor:#fff;--BackgroundColor:#f4f6fa;--text1:28px;--text2:26px;--text3:24px;--text4:22px;--text5:20px;--text6:18px}#home{font-size:16px}.desc_img,.postBody img{text-align:center;overflow:hidden;background-color:var(--BackgroundColor);position:relative}.desc_img:before,.postBody img:before{content:"\f03e"" 鍥剧墖鍔犺浇澶辫触锛�";background-color:var(--BackgroundColor);font-family:FontAwesome;line-height:110px;font-size:16px;color:var(--TextColor2)}.desc_img:after,.postBody img:after{content:"";width:20px;height:20px;position:absolute;top:0;left:0;font-size:16px;background-color:var(--BackgroundColor)}#green_channel_favorite:hover,#green_channel_follow:hover{background:none!important}#blog_nav_shortcut:before{content:"\f022";color:#fb7299;margin-right:6px;font-family:FontAwesome}#blog_nav_theme:before{content:"\f1de";margin-right:6px;color:#00c091;font-family:FontAwesome}#blog_nav_frieds:before{content:"\f0c1";margin-right:6px;color:#f3a034;font-family:FontAwesome}#blog_nav_maintain:before{content:"\f0ad";margin-right:6px;color:#ff5d47;font-family:FontAwesome}#blog_nav_cnblogs:before{content:"\f29a";margin-right:6px;color:#3c9ed1;font-family:FontAwesome}#tbCommentAuthor{background-color:transparent;width:100px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border:none;margin-left:-40px;font-size:16px;background-color:var(--BlockColor);line-height:30px;background-position:0;padding:10px 4px 10px 40px;background-image:url(https://images.cnblogs.com/cnblogs_com/webqiand/1381628/o_uesravatars.png);background-size:30px 30px}.commentbox_title_left{display:none}.commentbox_title{float:right;width:auto!important}html{transition:all .2s ease-in-out;-webkit-transition:all .2s ease-in-out}#commentbox_opt{text-align:right;float:right;color:var(--TextColor1)}.commentform p{margin:10px 0}#main{transition:all .2s ease-in-out;-webkit-transition:all .2s ease-in-out}tbody tr:nth-child(n+2){padding:20px 0}.shortcut{-webkit-transition:all .4s ease-in-out;transition:all .4s ease-in-out}#blog-calendar,#blog-comments-placeholder,#comment_form_container,#myposts .PostList,#sidebar_articlearchive,#sidebar_articlecategory,#sidebar_imagecategory,#sidebar_link,#sidebar_news,#sidebar_postarchive,#sidebar_postcategory,#sidebar_recentcomments,#sidebar_recentposts,#sidebar_scorerank,#sidebar_scroller,#sidebar_shortcut,#sidebar_topcommentedposts,#sidebar_topdiggedposts,#sidebar_toptags,#sidebar_topviewedposts,#slideContainer,#topics,#under_post_news,.catList.sidebar-block,.day,.entrylist,.mySearch,.shortcut{-webkit-transition:all .3s ease-in-out;transition:all .3s ease-in-out}.postText2{margin:10px 0}.PostList img{max-width:100%;border-radius:4px}#myposts .pager{text-align:center}.clipboard-button:before{content:"\f0ea";margin-right:10px;font-family:FontAwesome}#sidebar_shortcut ul li:first-child:before{content:"\f1fc";font-family:FontAwesome}#sidebar_shortcut ul li:nth-child(2):before{content:"\f075";font-family:FontAwesome}#sidebar_shortcut ul li:nth-child(3):before{content:"\f0c0";font-family:FontAwesome}#sidebar_shortcut ul li:nth-child(4):before{content:"\f27a";font-family:FontAwesome}#sidebar_shortcut ul li:nth-child(5):before{content:"\f02c";font-family:FontAwesome}.liScore:before{content:"\f005";font-family:FontAwesome}.liRank:before{content:"\f091";font-family:FontAwesome}#sidebar_recentposts ul li:before{content:"\f017";font-family:FontAwesome}#sidebar_links1575513 ul li:before{content:"\f121";font-family:FontAwesome}#sidebar_topviewedposts ul li:before{content:"\f06e";font-family:FontAwesome}#sidebar_topcommentedposts ul li:before{content:"\f075";font-family:FontAwesome}#sidebar_topdiggedposts ul li:before{content:"\f164";font-family:FontAwesome}#sidebar_imagecategory ul li:before{content:"\f03e";font-family:FontAwesome}#sidebar_articlearchive ul li:before,#sidebar_postarchive ul li:before{content:"\f073";font-family:FontAwesome}#sidebar_link ul li:before,#sidebar_postcategory ul li:before{content:"\f02d";font-family:FontAwesome}.catListTag ul li:before{content:"\f02c";font-family:FontAwesome}.blog_comment_body img{max-width:100%!important}.recent_comment_title:before{content:"\f27a";font-family:FontAwesome;margin-right:10px;margin-left:0}.recent_comment_author{border-bottom:1px solid var(--DividColor);padding:10px 0;margin-bottom:10px}li.recent_comment_body{background-color:var(--BackgroundColor);padding:10px;border-radius:4px}.dayTitle a:before{content:"\f073";font-family:FontAwesome;margin-right:10px;margin-left:0}.comment_date{float:right}.comment_actions,.comment_date,.comment_vote{color:var(--TextColor3)}.comment_actions{margin-left:-14px;display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex}.feedbackListSubtitle a:last-child{font-weight:700;color:var(--TextColor1);display:grid;margin-left:60px;margin-top:10px;margin-bottom:-40px}.feedbackListSubtitle a:last-child:hover{color:var(--ThemeColor)}.feedbackListSubtitle{color:transparent}.comment_actions a:last-child{font-weight:400!important;color:var(--TextColor3);margin:0!important;padding:0!important}.comment_burry:before{content:"\f088"}.comment_burry:before,.comment_digg:before{font-family:FontAwesome;margin-right:0;margin-left:10px}.comment_digg:before{content:"\f087"}#topics .postDesc a:nth-child(5):before{content:"\f040";font-family:FontAwesome;margin-right:0}#topics .postDesc a:nth-child(6):before{content:"\f02e";font-family:FontAwesome;margin-right:4px}#BlogPostCategory a:before{content:"\f02d";font-family:FontAwesome;margin-right:4px}#EntryTag a:before{content:"\f02c";font-family:FontAwesome;margin-right:4px}#cnblogs_post_body a{color:var(--ThemeColor)}.c_b_p_desc_readmore{display:none}.poem{background:-webkit-gradient(linear,left top,right top,from(#90caf9),color-stop(99%,#047edf));background:linear-gradient(90deg,#90caf9,#047edf 99%);border-radius:4px;color:#fff;padding:40px 20px}.poem #poem_sentence{text-align:center;font-size:20px}.poem #poem_info{text-align:right}.shortcut{overflow:hidden;border-radius:4px;background:var(--BlockColor);word-break:break-all;z-index:1000000000000000000}.shortcut h3{margin:20px 0;border-left:4px solid var(--ThemeColor);padding-left:10px}#shortcutContent{padding:0!important;margin:20px}#MySignature{display:block!important}.infocard{border-radius:4px;margin:0 0 20px;padding:10px;line-height:2}.infocard i{float:left;margin:0 10px;vertical-align:middle!important}.tip{background-color:#d5f1e5;color:#20704d}.warning{background-color:#f9e8de;color:#a84229}.normal{background-color:#dfedf8;color:#3162ae}details{border:1px solid #ddd;border-radius:4px;padding:.5em .5em 0;margin:10px 0}summary{font-weight:700;margin:-.5em -.5em 0;outline:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;background-color:#eff3f5;border-radius:4px}details[open],summary{padding:.5em}details[open] summary{border-bottom:1px solid #ddd;margin-bottom:.5em;border-radius:4px 4px 0 0}#card{background-color:var(--BlockColor);border-radius:8px;width:100%;margin:20px 0;border:1px solid hsla(210,8%,51%,.13)}#card:hover{-webkit-box-shadow:6px 11px 41px -28px #a99de7;box-shadow:6px 11px 41px -28px #a99de7}#card p{margin:0!important}#proBody center{background:rgba(0,0,0,.6);padding:20px}#proBody,#proBody center{border-radius:8px 8px 0 0}#proBody{background-color:#000;filter:Alpha(opacity=80);background-image:url(https://img2018.cnblogs.com/blog/1489774/201911/1489774-20191115181738072-2067895519.jpg);background-repeat:no-repeat;background-position:50%;background-size:cover}#proBody img{width:100px;-o-object-fit:cover;object-fit:cover;border-radius:50%}#proBody .name{font-size:28px;color:#fff;font-weight:700}#proBody .sign{color:#fff}#proBody .contact{background-color:#4d7cff;width:200px!important;color:#fff;margin:20px 0;padding:10px 20px;border:1px solid #4d7cff;border-radius:80px;outline:none}#proBody .contact:hover{opacity:.8}#proFooter{-webkit-columns:3;-moz-columns:3;column-count:3;padding:20px;text-align:center;border-top:1px solid hsla(210,8%,51%,.13)}#proFooter ul{margin-left:0!important}#proFooter li{list-style:none!important;line-height:2}#proFooter li:first-child,#proFooter li:nth-child(2){border-right:1px solid hsla(210,8%,51%,.13)}#div_digg{width:auto!important;font-size:22px}.buryit:hover,.diggit:hover{opacity:.8}.diggit{background:none!important;font-size:20px;padding:0;margin:0 20px 0 0;height:auto;width:auto!important;background-color:transparent!important;border:1px solid transparent!important}#digg_count,.diggit{color:var(--TextColor2)!important}.diggit:before{content:"\f087";font-family:FontAwesome;margin-right:0;margin-left:10px}.buryit{width:auto!important;font-size:20px;height:auto;padding:0;margin:0;background:none!important;background-color:transparent!important;border:1px solid transparent!important}#bury_count,.buryit{color:var(--TextColor2)!important}.buryit:before{content:"\f088";font-family:FontAwesome;margin-right:0;margin-left:10px}.myPostSignature{padding:12px 24px 12px 30px;margin-top:15px;margin-left:5px;font-size:15px;line-height:2;background-color:#f8f8f8;position:relative;border-bottom-right-radius:2px;border-top-right-radius:2px;border-left:4px solid var(--ThemeColor);z-index:1}.myPostSignature:before{content:"!";background-color:var(--ThemeColor);position:absolute;top:25px;left:-12px;color:#fff;width:20px;height:20px;border-radius:100%;text-align:center;line-height:20px;font-weight:700;font-size:14px}.myPostSignature p{margin:0!important;word-wrap:break-word;word-break:break-all;overflow:hidden}@media only screen and (min-width:361px) and (max-width:767px){#ViewPicture1_GalleryImage{max-width:100%!important}.mytoolbar{display:none}#mainContent{float:left!important;margin-left:0}#home,#main{margin:20px auto;padding:0!important;width:1200px!important}#sideBar{float:right!important;width:260px!important}#footer,#page_end_html{width:1200px!important;margin:0 auto}#sidebar_search_box input[type=text]{width:140px!important}#header{width:100%!important;display:inline-block;min-width:0!important}#green_channel{display:none}}@media only screen and (max-width:360px){::-webkit-scrollbar,::-webkit-scrollbar-thumb{display:none!important}::-webkit-scrollbar-track{display:none!important}#main{font-size:16px!important}#comment_form_container p:nth-of-type(3){overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-right:10px}#blog_post_info{display:grid!important}.c_b_p_desc{display:grid;color:var(--TextColor2);line-height:24px;-webkit-line-clamp:5}.c_b_p_desc .desc_img,.day .desc_img,.entrylistItem .desc_img{float:none;margin:-22px 0 10px!important;width:100%!important;max-width:100%!important}#header{margin:10px}#lnkBlogLogo{float:left}#blogTitle h1,#lnkBlogLogo{margin:0!important}#blogTitle{display:grid;text-align:center;width:auto!important}.blogStats{display:none!important}.postDesc a:nth-child(2):after{content:"";display:table;width:100%}#green_channel{width:100%!important;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center}#headbox,#header{width:100%!important;display:inline-block;overflow-x:auto;overflow-y:hidden;white-space:nowrap;min-width:0!important}#comment_form{margin:0!important;padding:0!important}.avatar{width:50px!important}.mytoolbar{position:fixed;z-index:1e+22;bottom:0;left:0;right:0;padding:10px;font-size:20px}#sidebar_scroller{position:fixed!important;top:0!important;left:0!important;right:0!important;bottom:0;opacity:.98;width:auto!important;max-width:100%;margin-bottom:0!important;display:none;border-radius:0!important;border:none!important;border-bottom:1px solid #eee;z-index:999999999}.mytoolbar #toolbtn{-webkit-columns:3;-moz-columns:3;column-count:3;width:80%;margin:0 auto}.mytoolbar #toolbtn li a{color:inherit}.mytoolbar #toolbtn li{text-align:center;padding:6px;margin:0 10px;background-color:var(--BlockColor);border:1px solid var(--DividColor);border-radius:4px;list-style-type:none!important}#header .dropdown{float:right;margin-right:20px}#header .dropdown-content{margin-left:-70px}#header li{list-style:none;padding:0 6px}#navigator .div_my_zzk{float:left!important}#navigator .input_my_zzk{width:160px!important}#home,#main{width:auto!important}#footer,#mainContent,#page_end_html{width:auto!important;min-width:0!important}#sideBar{width:auto!important;margin-left:0!important}#navList{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;margin-right:20px}#navList li{float:left;list-style:none;margin:0!important}}*{margin:0;padding:0}body{background-color:var(--BackgroundColor);font-size:16px;line-height:1.5;letter-spacing:1px}div{display:block}a{text-decoration:none;color:inherit}a:hover{color:var(--ThemeColor)}h1,h2,h3,h4,h5,h6{color:var(--TextColor1)}#home{width:100%;margin:0 auto}#main{width:100%;width:1200px;margin:20px auto}#mainContent{width:900px;float:left;padding:0;border-radius:2px}#sideBar{width:280px;margin-left:20px;float:left}#footer{margin-top:40px;padding:20px 0}#footer,#viewcount{width:100%;text-align:center;color:var(--TextColor3)}#header,#viewcount{margin:0 auto}#header{border-radius:0 0 4px 4px;overflow:hidden;background-color:var(--BlockColor);max-width:1200px}#lnkBlogLogo{float:left;margin:20px 20px 20px 0}#blogTitle h1{margin:20px 0 0;font-size:28px}#Header1_HeaderTitle{color:#fff;text-decoration:none}#blogTitle h2{margin:10px 0 20px;font-size:16px;color:#fff;min-height:60px;line-height:1.5;-webkit-box-orient:vertical;-webkit-line-clamp:5;text-overflow:ellipsis;overflow:hidden;font-weight:400}#navigator{margin:0;height:50px;overflow-x:auto}#navList,.blogStats{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;margin:0;float:left;width:auto;padding-left:20px;line-height:50px}#navList li{width:auto;list-style:none}#navList li a{color:inherit;margin-right:20px;text-decoration:none}.blogStats{float:right;color:var(--TextColor2);margin-right:20px}#blog_nav_sitehome:before{content:"\e62d";color:#fb7299;font-family:iconfont}#blog_nav_myhome:before{content:"\e626";color:#00c091;font-family:iconfont}#blog_nav_newpost:before{content:"\e628";color:#3c9ed1;font-family:iconfont}#blog_nav_contact:before{content:"\e624";color:#f3a034;font-family:iconfont}#blog_nav_rss:before{content:"\e62a";color:#ff5d47;font-family:iconfont}#blog_nav_admin:before{content:"\e627";color:#23c9ed;font-family:iconfont}#blog_nav_gitee:before{content:"\e62a";color:#b8312d;font-family:iconfont}#blog_nav_wechat:before{content:"\e624";color:#5cba58;font-family:iconfont}#blog_nav_group:before{content:"\e718";color:#5cba58;font-family:iconfont}#blog_nav_fuye:before{content:"\e62d";color:red;font-family:iconfont}#navList li a{line-height:48px}#navList li:hover a{color:#00a1d6;border-bottom:3px solid #00a1d6;padding-bottom:12px}#stats-comment_count:before,#stats_article_count:before{content:"|";margin:0 10px}.day{background-color:var(--BlockColor);padding:20px;border-radius:4px;margin-bottom:20px}.day .postTitle{border-top:1px solid var(--DividColor);margin-top:10px;padding:10px 0}.day .postDesc{word-break:keep-all;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dayTitle{line-height:2.4;width:100%;font-size:var(--text6);color:var(--TextColor1)}.day .postTitle2{font-size:var(--text4);line-height:1.5;padding-left:10px;border-left:4px solid var(--ThemeColor)}#topics .postTitle{line-height:1.2;text-align:center;padding:0 0 20px;margin-bottom:20px}#topics .postDesc{text-align:center}#topics .post{display:grid;grid-template-columns:100%}#topics .postBody{-webkit-box-ordinal-group:2;-webkit-order:1;-ms-flex-order:1;order:1}.c_b_p_desc{color:var(--TextColor2);line-height:24px;padding:2px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:5;text-overflow:ellipsis;overflow:hidden}.c_b_p_desc a{margin:10px 0!important;line-height:2.4;text-align:center;padding:4px 9px!important;background-color:var(--BackgroundColor)!important;border:1px solid var(--DividColor)!important;border-radius:4px}#EntryTag,.post .postBody #BlogPostCategory,.postDesc{color:var(--TextColor3);line-height:1.8;margin:0}.desc_img{height:110px;margin:0 10px 10px 20px;width:190px;-o-object-fit:cover;object-fit:cover;-webkit-box-shadow:0 0 0 1px var(--DividColor);box-shadow:0 0 0 1px var(--DividColor);border-radius:4px}#sideBar h3{line-height:2.4;width:100%;margin-bottom:10px;font-size:var(--text6);color:var(--TextColor1);border-bottom:1px solid var(--DividColor)}.myprofile{margin:20px 0 0;height:auto}.myprofile-bottom{padding:20px 0;border-top:1px solid var(--DividColor)}.myprofile-top{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;margin:0 auto 20px}.avatar{width:80px;float:left}.avatar img{width:100%;border:1px solid #ddd;border-radius:50%}.profile-info{float:left;margin-left:20px}.nickname{font-size:20px;line-height:30px;font-weight:600}#mywords{line-height:20px;font-size:12px}.myprofile ul{-webkit-columns:3;-moz-columns:3;column-count:3}.myprofile ul li{text-align:center;list-style-type:none;line-height:20px}#sidebar_news{background-color:var(--BlockColor);padding:10px 20px;border-radius:4px;margin-bottom:20px}#profile_block{line-height:2}#p_b_follow{background-color:var(--ThemeColor);border-radius:4px;margin:10px 0;line-height:3;text-align:center}#p_b_follow:hover{opacity:.8}#p_b_follow a,#p_b_follow span{color:#fff!important}#blog-calendar{background-color:var(--BlockColor);padding:10px 20px;border-radius:4px;margin-bottom:20px}.CalDayHeader,.CalTitle{line-height:2.4;font-size:var(--text6);color:var(--TextColor1)}.CalDayHeader{border-bottom:1px solid var(--DividColor)}.CalWeekendDay{line-height:2}.CalTodayDay,.CalTodayDay u{color:#fff!important}#blog-calendar u{color:var(--ThemeColor);font-weight:600;text-decoration:none!important}.CalTodayDay{background-color:var(--ThemeColor);line-height:2.15;border-radius:50%;height:34px!important;width:34px!important}.mySearch{background-color:var(--BlockColor);padding:10px 20px;border-radius:4px;margin-bottom:20px}#sidebar_search_box .input_my_zzk{padding:6px;outline:none;margin-left:5px;background:var(--BackgroundColor);border:1px solid var(--DividColor);border-radius:4px;width:145px;vertical-align:middle;height:20px}#sidebar_search_box .input_my_zzk:hover{border:1px solid var(--ThemeColor)}input.btn_my_zzk{color:#fff;background-color:var(--ThemeColor);border:1px;padding:8px;border-radius:2px;height:auto!important}input.btn_my_zzk:hover{outline:none;opacity:.7}.scroller-offset1{text-indent:0}.scroller-offset1,.scroller-offset2{overflow:hidden;text-overflow:ellipsis!important}.scroller-offset2{text-indent:1.5em}.scroller-offset3{text-indent:3em}.scroller-offset3,.scroller-offset4{overflow:hidden;text-overflow:ellipsis!important}.scroller-offset4{text-indent:4.5em}.scroller-offset5{text-indent:6em}.scroller-offset5,.scroller-offset6{overflow:hidden;text-overflow:ellipsis!important}.scroller-offset6{text-indent:7.5em}.nav .active{background-color:var(--BackgroundColor);border-radius:2px;margin:0 6px}.nav .active a{color:var(--ThemeColor)}.nav{max-height:400px;overflow-y:auto;overflow-x:hidden;white-space:nowrap}.nav li{padding:2px 10px}.nav li a{text-overflow:ellipsis!important;width:100px!important;white-space:nowrap}#sidebar_articlearchive,#sidebar_articlecategory,#sidebar_imagecategory,#sidebar_link,#sidebar_postarchive,#sidebar_postcategory,#sidebar_recentcomments,#sidebar_recentposts,#sidebar_scorerank,#sidebar_scroller,#sidebar_shortcut,#sidebar_topcommentedposts,#sidebar_topdiggedposts,#sidebar_toptags,#sidebar_topviewedposts,.catList.sidebar-block{background-color:var(--BlockColor);padding:10px 20px;border-radius:4px;margin-bottom:20px}#sidebar_articlearchive ul li,#sidebar_articlecategory ul li,#sidebar_imagecategory ul li,#sidebar_link ul li,#sidebar_postarchive ul li,#sidebar_postcategory ul li,#sidebar_recentcomments ul li,#sidebar_recentposts ul li,#sidebar_scorerank ul li,#sidebar_scroller ul li,#sidebar_shortcut ul li,#sidebar_topcommentedposts ul li,#sidebar_topdiggedposts ul li,#sidebar_toptags ul li,#sidebar_topviewedposts ul li,.catList.sidebar-block ul li{list-style:none;line-height:2}#nav_next_page{margin-bottom:20px}.topicListFooter{margin:0!important}.pager,.topicListFooter{line-height:3;overflow-x:auto;display:block!important}.Pager a,.pager a,.topicListFooter a{background-color:var(--BlockColor);padding:6px 10px;display:inline-table;line-height:1.5;color:var(--TextColor1);border:1px solid var(--DividColor);border-radius:4px}.pager .current{padding:6px 10px!important;display:inline-table;line-height:1.5;color:#fff!important;border:1px solid var(--ThemeColor)!important;background-color:var(--ThemeColor)!important;border-radius:4px}.Pager a:hover,.pager a:hover,.topicListFooter a:hover{color:#fff;border:1px solid var(--ThemeColor);background-color:var(--ThemeColor)}.pager,.Pager{font-size:16px;color:var(--TextColor2)}#taglist_main{margin-top:0!important}.filter_img{width:100%!important;margin:20px 0 0!important;max-height:none!important;display:inline-block!important;max-width:none!important;border-radius:4px!important}#taglist_title,.PostListTitle{line-height:2.4;font-size:var(--text1);color:var(--TextColor1);padding:20px;border-radius:4px;text-align:center;margin-bottom:20px}#taglist{background-color:var(--BlockColor);padding:20px;border-radius:4px;margin:20px 0}#myposts{margin:0!important}.PostList{background-color:var(--BlockColor);padding:20px;border-radius:4px;margin:20px 0!important}.PostList .postTitl2{font-size:var(--text4);line-height:1.5;color:var(--TextColor1)}.postTitl2 a{padding-left:10px;border-left:4px solid var(--ThemeColor)}.PostList .postDesc2{color:var(--TextColor3);font-size:16px!important;line-height:3}.PostList .postText2{color:var(--TextColor2);word-break:break-all;font-size:var(--text6)!important;line-height:1.5}.gallery{background-color:var(--BlockColor);padding:20px;border-radius:4px;margin-bottom:20px}.gallery .thumbTitle{line-height:2.4;width:100%;font-size:var(--text1);color:var(--TextColor1)}.gallery img{max-width:100%}.divPhoto{margin:10px}.table-box{line-height:2.4;font-size:var(--text1);color:var(--TextColor1);padding:20px 0;text-align:center}.entrylist,.table-box{border-radius:4px;margin-bottom:20px}.entrylist{background-color:var(--BlockColor);padding:20px}.entrylistItem{border-top:1px solid var(--DividColor);margin-top:10px;padding-top:10px}.entrylistTitle{width:100%;font-size:var(--text1)}.entrylistPosttitle,.entrylistTitle{margin:10px 0;color:var(--TextColor1)}.entrylistPosttitle{font-size:var(--text4);line-height:1.5}.entrylistItemTitle{padding-left:10px;border-left:4px solid var(--ThemeColor)}.entrylistPostSummary{color:var(--TextColor2);line-height:1.5}.entrylistItemPostDesc{color:var(--TextColor3);font-size:16px;line-height:1.5}#widget_my_google,#widget_my_zzk{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;font-size:16px!important}.input_my_zzk{-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1;float:left}#topics{background-color:var(--BlockColor);padding:20px;border-radius:4px;margin-bottom:20px}#cb_post_title_url{font-size:var(--text2)}#topics .postTitle{border-bottom:1px solid var(--DividColor)}#blog_post_info{margin:10px auto;width:100%}#green_channel{border:none!important;width:auto;font-size:16px;display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;padding:0}#green_channel a:hover{color:var(--ThemeColor)}#green_channel_wechat img,#green_channel_weibo img{display:none}#green_channel_weibo:before{content:"\f18a";font-family:FontAwesome;color:#d21212;margin-right:4px;margin-left:0}#green_channel_wechat{margin-right:0!important}#green_channel_wechat:before{content:"\f1d7";color:#14981a;font-family:FontAwesome;margin-right:4px;margin-left:0}#div_digg{float:right;margin:0 auto}#author_profile{display:none}#green_channel a{font-weight:400;font-size:16px!important;margin-right:20px;color:var(--TextColor2);text-shadow:none!important}#green_channel #green_channel_digg{display:none}#green_channel #green_channel_follow:before{content:"\f08a";font-family:FontAwesome;margin-right:4px;margin-left:0}#green_channel #green_channel_favorite:before{content:"\f006";font-family:FontAwesome;margin-right:4px;margin-left:0}#green_channel #green_channel_favorite,#green_channel #green_channel_follow,#green_channel #green_channel_wechat,#green_channel #green_channel_weibo{color:var(--TextColor2)!important;background-color:transparent;border:1px solid transparent;padding:0;font-size:16px;-webkit-box-shadow:none!important;box-shadow:none!important}#green_channel #green_channel_weibo:hover{background-color:transparent!important}#green_channel_weibo img{margin-left:0!important}#green_channel #green_channel_wechat:hover{background-color:transparent!important}#green_channel_wechat img{margin-left:0!important}.author_avatar{width:50px;height:50px;padding:0!important;float:left;margin:10px 10px 10px 0;border-radius:50%;border:1px solid var(--DividColor)}#post_next_prev{border-top:1px solid var(--DividColor);font-size:14px;line-height:1.8;padding-top:20px;color:var(--TextColor1)}#ad_c1,#ad_c2,#ad_t2,.c_ad_block{display:none}.layer{color:#3c9ed1;border:1px solid #3c9ed1;border-radius:4px}.layer,.louzhu{padding:2px 6px;font-size:14px}.louzhu{color:#00c091;border:1px solid #00c091;border-radius:4px;margin-left:-6px;margin-right:-6px}.body_right img{border:1px solid var(--DividColor)}#blog-comments-placeholder,#divCommentShow{background-color:var(--BlockColor);border-radius:4px;margin-bottom:20px}.comment_my_posted{padding:20px}.bq_post_comment{margin:5px;font-style:normal;line-height:2;border:none;color:var(--TextColor2);padding:10px}#tbCommentAuthor{width:100px}.blog_comment_body{word-wrap:break-word;overflow:hidden;padding:30px 0 10px;border-radius:4px}.comment_quote{padding:5px 5px 5px 10px;color:#ccc;border:solid #ccc;border-width:0 0 0 4px}legend{display:none}.feedback_area_title{font-size:var(--text6);color:var(--TextColor1);line-height:2;background-image:none;border-bottom:1px solid var(--DividColor);padding:0;margin:0 20px;font-weight:700}.feedbackItem{border-bottom:1px solid var(--DividColor)}.feedbackItem,.new-comment-block{margin:0 20px;padding:20px 0;position:relative}.feedbackManage{float:left;position:absolute;bottom:20px}.blog_comment_body,.new-comment-block p{line-height:2;color:var(--TextColor2);margin:10px 0}.new-comment-block p{word-wrap:break-word;overflow:hidden;background-color:var(--BackgroundColor)}#comment_nav,.new-comment-block p{padding:10px 20px;border-radius:4px}#comment_nav{line-height:50px;text-align:center;color:var(--TextColor1);background-color:var(--BlockColor);margin:20px 0}#comment_pager_bottom{padding:20px}#comment_form_container{background-color:var(--BlockColor);padding:10px 20px;border-radius:4px;margin-bottom:20px}#commentform_title{font-size:var(--text6);color:var(--TextColor1);line-height:2;background-image:none;border-bottom:1px solid var(--DividColor);padding:0;font-weight:700;margin-left:15px}#comment_form_container p{line-height:2;color:var(--BlockColor)}#commentbox_opt a{color:var(--TextColor1)}.commentbox_main{margin-top:-50px}.commentbox_title_right{height:30px}.commentbox_title{width:100%}#tbCommentBody{margin-top:10px;width:100%!important;height:200px!important;border:1px solid var(--DividColor);border-radius:6px;padding:5px;font-family:inherit;font-size:14px;resize:none;-webkit-box-sizing:border-box;box-sizing:border-box;background-color:transparent;color:var(--TextColor1)}.commentform .comment_textarea:focus{outline:0}#btn_comment_submit,#tbCommentBody:hover{border-color:var(--ThemeColor)}#btn_comment_submit{width:auto;height:auto;border-width:0;cursor:pointer;color:#fff;background-color:var(--ThemeColor);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;padding:5px 20px;border-radius:5px;-webkit-transition:color .2s linear,background-color .2s linear,border .2s linear,-webkit-box-shadow .2s linear;transition:color .2s linear,background-color .2s linear,border .2s linear,-webkit-box-shadow .2s linear;transition:color .2s linear,background-color .2s linear,border .2s linear,box-shadow .2s linear;transition:color .2s linear,background-color .2s linear,border .2s linear,box-shadow .2s linear,-webkit-box-shadow .2s linear}#btn_comment_submit:hover{opacity:.7}#comment_form_container p:nth-of-type(3){color:var(--TextColor2)}#under_post_news{background-color:var(--BlockColor);padding:10px 20px;border-radius:4px;margin-bottom:20px}#HistoryToday,.recomm-block{max-width:100%}.recomm-block b{font-size:var(--text6);color:var(--TextColor1);line-height:2.4;padding:0}.recomm-block a{width:100%}#topics .postDesc{color:transparent;font-size:0}#topics .postDesc a:hover{color:var(--ThemeColor)}#post-date,#post_comment_count,#post_view_count,#topics .postDesc a{color:var(--TextColor3);font-size:16px;margin-right:10px}#post-date:before{content:"\f017";margin-right:4px;font-family:FontAwesome}#topics .postDesc a:nth-child(2):before{content:"\f2be";margin-right:4px;font-family:FontAwesome}#topics .postDesc #post_view_count:before{content:"\f06e";margin-right:4px;font-family:FontAwesome}#topics .postDesc #post_comment_count:before{content:"\f27b";margin-right:4px;font-family:FontAwesome}.post .postBody{line-height:1.7;color:var(--TextColor1)}.post .postBody h1{font-size:32px!important}.post .postBody h1,.post .postBody h2{margin-top:24px!important;margin-bottom:16px!important;border-bottom:1px solid var(--DividColor);line-height:1.25;padding-bottom:.3em}.post .postBody h2{font-size:24px!important}.post .postBody h3{font-size:20px!important}.post .postBody h3,.post .postBody h4{margin-top:24px!important;margin-bottom:16px!important;line-height:1.25}.post .postBody h4{font-size:16px!important}.post .postBody h5{font-size:14px!important}.post .postBody h5,.post .postBody h6{margin-top:24px!important;margin-bottom:16px!important;line-height:1.25}.post .postBody h6{font-size:13.6px!important}.post .postBody p{margin:17px auto}.post .postBody blockquote{color:#6a737d;margin:20px 0;padding:0 0 0 10px;min-height:20px;background:0 0;border:none;border-left:4px solid}#cnblogs_post_body{margin:20px 0}#cnblogs_post_body blockquote ul li{color:#6a737d!important}#cnblogs_post_body img{margin:0 auto}.post .postBody em{padding-right:3px}.post .postBody strong{margin:0 3px}.post .postBody img{max-width:100%!important;display:block;border-radius:3px}.post .postBody ol li,.post .postBody ul li{margin:3px 0;font-size:15px}.post .postBody ol li p,.post .postBody ul li p{margin:0!important}#cnblogs_post_body table{display:block;padding:2px;width:100%}.post .postBody table{font-size:15px;border-collapse:collapse;border-spacing:0;empty-cells:show;border:none!important;overflow:auto;width:100%;word-break:keep-all!important}.post .postBody table th{font-family:inherit;font-size:inherit;white-space:nowrap;font-weight:600;border:1px solid var(--DividColor)!important;padding:8px 16px!important}.post .postBody table th,.post .postBody table tr:nth-child(2n){background-color:var(--BackgroundColor)!important}.post .postBody table tr{background-color:var(--BlockColor)!important}.post .postBody table td{border:1px solid var(--DividColor)!important;padding:8px 16px!important}.post .postBody h1 code,.post .postBody h2 code,.post .postBody h3 code,.post .postBody h4 code,.post .postBody h5 code,.post .postBody h6 code,.post .postBody li code,.post .postBody p code,.post .postBody table code{color:#c7254e;line-height:1;font-family:consolas!important;vertical-align:middle;margin:0 3px;background:var(--BackgroundColor)!important;font-size:14px!important;padding:.2em .3em!important;border-radius:3px!important;border:1px solid var(--DividColor)!important}.post .postBody #BlogPostCategory a{margin-left:5px}.post .postBody #post_next_prev{font-size:16px;margin-top:20px;padding-top:20px}.post .postBody hr{background-color:var(--DividColor);border:0;height:.25em;margin:24px 0;padding:0}#cnblogs_post_body ul ul li{list-style-type:circle}#cnblogs_post_body ul ul ul li,.post .postBody ul ul ul{list-style-type:square!important}.post .postBody ul ul{list-style-type:circle!important}.post .postBody ul{list-style-type:disc!important}.cnblogs_code{background-color:#f2f4f5;padding-left:1em;padding-right:1em;border:none!important;border-radius:3px!important;font-family:Lucida Console,Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace!important}.cnblogs_code div{background-color:transparent;color:#656c73}.cnblogs_code img{margin:0!important}.cnblogs_code pre{color:#656c73;font-family:inherit!important}.cnblogs_code pre span{font-family:inherit!important;color:inherit!important}.cnblogs_code textarea{font-family:inherit!important;padding:5px;border:1px solid #3e4c42;color:#c5d4ef;background-color:#282c34}.cnblogs_code textarea:focus{outline:0}.cnblogs_code .code_img_closed,.cnblogs_code .code_img_opened{display:none!important}.cnblogs_code .cnblogs_code_toolbar{width:20px}.cnblogs_code .cnblogs_code_toolbar span{padding-right:0}.cnblogs_code .cnblogs_code_toolbar a:link img{background-color:transparent!important}.cnblogs_code .cnblogs_code_collapse{color:#656c73;border:1px solid #989fa6;border-radius:2px;background-color:transparent;display:inline-block;cursor:pointer;padding:5px 5px 2px}kbd{margin:0 .1em;padding:.1em .6em;font-size:.8em;color:#242729;background:#fff;border:1px solid #adb3b9;border-radius:3px;-webkit-box-shadow:0 1px 0 rgba(12,13,14,.2),0 0 0 2px #fff inset;box-shadow:0 1px 0 rgba(12,13,14,.2),inset 0 0 0 2px #fff;white-space:nowrap;vertical-align:middle}.matlab .hljs-keyword{color:#0000fe}.matlab .hljs-string{color:#a020ef}.matlab .hljs-comment{color:#228b22}.matlab .hljs-built_in,.matlab .hljs-function,.matlab .hljs-title{color:var(--TextColor1)}.cnblogs-markdown .hljs,.cnblogs-markdown .matlab-code,.cnblogs_Highlighter pre{display:block;color:var(--TextColor1);border-radius:4px;overflow-x:auto;background:var(--BackgroundColor)!important;border:none!important;font-family:Consolas!important;padding:1em!important;font-size:14px!important}.cnblogs-markdown pre{white-space:pre}.hljs{display:block;overflow-x:auto;padding:.5em;color:#383a42;background:#fafafa}.hljs-comment,.hljs-quote{color:#a0a1a7;font-style:italic}.hljs-doctag,.hljs-formula,.hljs-keyword{color:#a626a4}.hljs-deletion,.hljs-name,.hljs-section,.hljs-selector-tag,.hljs-subst{color:#e45649}.hljs-literal{color:#0184bb}.hljs-addition,.hljs-attribute,.hljs-meta-string,.hljs-regexp,.hljs-string{color:#50a14f}.hljs-built_in,.hljs-class .hljs-title{color:#c18401}.hljs-attr,.hljs-number,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-pseudo,.hljs-template-variable,.hljs-type,.hljs-variable{color:#986801}.hljs-bullet,.hljs-link,.hljs-meta,.hljs-selector-id,.hljs-symbol,.hljs-title{color:#4078f2}.hljs-emphasis{font-style:italic}.hljs-strong{font-weight:700}.hljs-link{text-decoration:underline}.matlab-code{white-space:pre}.matlab-code .matlab-keyword,code .matlab-keyword{color:#0000fe}.matlab-code .matlab-string,code .matlab-string{color:#a020ef}.matlab-code .matlab-bracket,.matlab-code .matlab-number,code .matlab-bracket,code .matlab-number{color:var(--TextColor1)}.matlab-code .matlab-comment,code .matlab-comment{color:#228b22}.matlab-code .matlab-comment span,code .matlab-comment span{color:#228b22;font-weight:400}#cnblogs_post_body .video{height:0;margin:10px auto;padding-bottom:56.25%;position:relative;width:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center}#cnblogs_post_body .video iframe,#cnblogs_post_body .video video{position:absolute;top:0;border-radius:4px;-webkit-box-shadow:6px 11px 41px -28px #a99de7;box-shadow:6px 11px 41px -28px #a99de7;border:1px solid var(--DividColor);width:98%;height:100%;z-index:0}#cnblogs_post_body .music{height:140px;position:relative;width:100%}#cnblogs_post_body .music iframe{position:absolute;left:0;top:0;width:100%;height:100%}.__zy_bounce __zy_animated __zy_infinite{display:none}.div-box{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;height:40px;line-height:40px;background:#fff;text-align:center;width:100%;margin-top:20px}.input-url{-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1;padding:10px;outline:none;margin-left:5px;background:#fff;border:1px solid #b6b6b6;border-radius:4px}.jiexi{background:#3385ff;border:1px solid #3385ff;padding:10px 20px;border-radius:4px;margin:0 4px 0 10px;height:40px;outline:none;color:#fff}.jiexi:hover{background-color:#2a6bcc}.dropdown{position:relative;display:inline-block}.dropdown-content{display:none;z-index:9999;margin-left:10px;position:absolute;background-color:#f9f9f9;width:100px;border-radius:4px;-webkit-box-shadow:0 8px 16px 0 rgba(0,0,0,.2);box-shadow:0 8px 16px 0 rgba(0,0,0,.2)}.dropdown:hover .dropdown-content{display:block}.dropdown-content p{color:#000;display:block;cursor:pointer}.dropdown-content p:hover{background-color:#f1f1f1}#slideContainer{display:block}#slideContainer img{max-width:100%!important}.cl:after{content:".";display:block;height:0;clear:both;visibility:hidden}.cl{zoom:1}.frame{margin-bottom:10px;border:1px solid #e1e1e1;background:#fff}.title{padding:0 10px;height:32px;font-size:14px;font-weight:700;line-height:32px;overflow:hidden}.block{margin:10px 10px 0}.temp{margin:1px}.slideshow{clear:both}.slideshow li{position:relative;overflow:hidden}.slideshow span.title{position:absolute;bottom:0;left:0;margin-bottom:0;width:100%;height:auto;line-height:32px;font-size:16px;text-indent:10px}.slidebar li,.slideshow span.title{filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#30000000,endColorstr=#30000000)}.slidebar li{float:left;margin-right:1px;width:20px;height:20px;line-height:20px;text-align:center;font-size:10px;cursor:pointer}.slidebar li.on{filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#50FFFFFF,endColorstr=#50FFFFFF);color:#000}.frame{background:none;border:0 solid #fff;margin-bottom:0}.temp{margin:0}.slidebar{position:absolute;top:5px;left:4px}.slidebar li,.slideshow span.title{background:rgba(0,0,0,.3);color:#fff;overflow:hidden}.slidebar li,.slidebar li.on,.slideshow span.title{filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#90000000,endColorstr=#90000000)}.slidebar li.on{background:hsla(0,0%,100%,.5);color:#b62525;font-weight:700}.slideshow SPAN.title{text-indent:0}.block{margin:0;position:relative}#frameHlicAe{margin:0!important;border:0!important}.comiis_wrap960,.comiis_wrapad{margin:0 auto;background-color:var(--BlockColor);border-radius:4px}.comiis_wrapad{padding:20px;margin-bottom:20px;overflow:hidden}.comiis_wrapad img{float:left;margin-top:0;width:100%}#slidesImgs li{width:100%;height:auto;display:none}</style><style>:root{--ThemeColor: #4169E1}<style></style><style>.gray-filter{-webkit-filter:grayscale(100%);filter:grayscale(100%);filter:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale");filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1)}.gray-filter body{background-color:grey;background-image:none}</style><link rel="shortcut icon" href="https://gitee.com/niceyoo/blog/raw/master/img/favicon.png" type="image/x-icon"></head>
文章美化
博客一般都是用markdown来写的,markdown虽简洁,但样式还可以更美些。mdnice就是做这个的。官方地址:https://www.mdnice.com/。
可以用Typora在本地写好markdown后,直接复制到官网网页版,然后点击右侧复制到知乎
,即复制为HTML代码。将复制好的代码粘贴到博客园中的博客即可。这样就得到美化后的博客了。
![复制美化后的代码](https://gitee.com/cjiayang/picgo-img/raw/master/img/image-20220119173018729.png)