Custom blog styles and blog styles

Custom blog styles and blog styles
Statement

Blog style is for reference only. Please contact me for help.

Global Style

The first choice is the bulesky style that comes with the blog garden,

Option: # ad_t2, # under_post_news, # under_post_kb, # HistoryToday, # ad_c1, # ad_c2 {display: none;} # header {position: fixed; top: 0; left: 0; right: 0; z-index: 2 ;}# main {margin-top: 40px;} body {font-size: 15px; font-family: "";} # cnblogs_post_body h2 {background: none repeat scroll 0% 0% rgb (216,216,216); border-radius: 6px 6px 6px; color: rgb (102,102,102); font-family: "Comic Sans MS", ""; font-size: 17px; Margin: 15px 0px! Important; padding: 5px 0px 5px 20px ;}. post {background-color: # ffffff ;}# cnblogs_post_body p> img {-webkit-box-shadow: 0 0 20px 5px # dadada;-moz-box-shadow: 0 0 20px 5px # dadada; box-shadow: 0 0 20px 5px # dadada; margin: 20px ;}# tbCommentBody {width: 95%; height: 100px ;} h4 {background-color: # f1f1f3; margin: 0-32px; padding: 0 32px; color: red ;}# navigator, # blogTitle, # main, # footer {width: export PX ;}# mainContent {width: 965px ;}# cnblogs_post_body img {max-width: 850px ;}. forFlow img {max-width: 80% ;}. postBody blockquote ,. postCon blockquote {border-left-style: inset; border-left-width: 4px; border-left-color: # 16a89d; background: # f1f1f3; margin-top: 20px ;} # page_begin_html {position: fixed; z-index: 99999 ;}. modem{ margin-top: 20px; margin-bottom: 20px; color: # F77908; font-size: 14px; text-align: center ;}Side announcement board

Added an image and a motto.

You can add an image by using its address to upload a photo to the album.

<Div>  <div> <p class = "motto"> love learning, every day. </P>

Top

Customize some navigation.

<Script> // navigation $ ("# navList "). append ("<li> <a class = 'menu 'href = 'HTTP: // www.cnblogs.com/lixu880/p/6379627.html'> reading </a> </li> "); $ ("# navList "). append ("<li> <a class = 'menu 'href = 'https: // github.com/lixu.html'> Github </a> </li> "); $ ("# navList "). append ("<li> <a class = 'menu 'href = 'HTTP: // www.cnblogs.com/lixu880/p/6379789.html'> about me </a> </li>"); </script>

Footer

Add a hyperlink to return to the top.

 

<a href="###" id="returnTop" style="bottom: 10px;position: fixed;right: 10px;font-size: 16px;">returnTop</a><script>$(function(){$('#returnTop').click(function () {$('html,body').animate({ scrollTop: '0px' }, 800);returnfalse;});});</script>

Last

I hope you can build your favorite personalized blog.