第一次入博客如何简单的设置博客园皮肤

 

(1)

进到设置里面

 

(2)

把下面代码复制到 <定制CSS代码>

  1 /*simplememory*/
  2 #google_ad_c1, #google_ad_c2 {display:none;}
  3 .syntaxhighlighter a, .syntaxhighlighter div, .syntaxhighlighter code, .syntaxhighlighter table, .syntaxhighlighter table td, .syntaxhighlighter table tr, .syntaxhighlighter table tbody, .syntaxhighlighter table thead, .syntaxhighlighter table caption, .syntaxhighlighter textarea {
  4 font-size: 14px!important;
  5 }
  6 #home {
  7 opacity: 0.80;
  8 margin: 0 auto;
  9 width: 85%;
 10 min-width: 950px;
 11 background-color: #fff;
 12 padding: 30px;
 13 margin-top: 30px;
 14 margin-bottom: 50px;
 15 box-shadow: 0 2px 6px rgba(100, 100, 100, 0.3);
 16 }
 17 #blogTitle h1 {
 18 font-size: 30px;
 19 font-weight: bold;
 20 font-family: "Comic Sans MS";
 21 line-height: 1.5em;
 22 margin-top: 20px;
 23 color: #515151;
 24 }
 25 #navList a:hover {
 26 color: #4C9ED9;
 27 text-decoration: none;
 28 }
 29 #navList a {
 30 display: block;
 31 width: 5em;
 32 height: 22px;
 33 float: left;
 34 text-align: center;
 35 padding-top: 18px;
 36 }
 37 #navigator {
 38 font-size: 15px;
 39 border-bottom: 1px solid #ededed;
 40 border-top: 1px solid #ededed;
 41 height: 50px;
 42 clear: both;
 43 margin-top: 25px;
 44 }
 45 .catListTitle {
 46 margin-top: 21px;
 47 margin-bottom: 10.5px;
 48 text-align: left;
 49 border-left: 10px solid rgba(82, 168, 236, 0.8);
 50 padding: 10px 0 14px 10px;
 51 background-color: #f5f5f5;
 52 }
 53 #ad_under_post_holder #google_ad_c1,#google_ad_c2{ 
 54 display: none !important;
 55 }
 56 body {
 57 color: #000;
 58 background: url(https://images.cnblogs.com/cnblogs_com/threeearscat/1702150/o_200415075544fond.jpg) fixed;      /*把地址替换为自己喜欢的图片的地址*/
 59 background-size: 100%;
 60 background-repeat: no-repeat;
 61 font-family: "Helvetica Neue",Helvetica,Verdana,Arial,sans-serif;
 62 font-size: 12px;
 63 min-height: 101%;
 64 }
 65 #topics .postTitle {
 66 border: 0px;
 67 font-size: 200%;
 68 font-weight: bold;
 69 float: left;
 70 line-height: 1.5;
 71 width: 100%;
 72 padding-left: 5px;
 73 }
 74 
 75 
 76 div.commentform p{
 77 margin-bottom:10px;
 78 }
 79 .comment_btn {
 80 padding: 5px 10px;
 81 height: 35px;
 82 width: 90px;
 83 border: 0 none;
 84 border-radius: 5px;
 85 background: #ddd;
 86 color: #999;
 87 cursor:pointer;
 88 font-family: "Lato", Helvetica Neue, Helvetica, Microsoft Yahei, 宋体, Arial, sans-serif;
 89 text-shadow: 0 0 1px #fff;
 90 display: inline !important;
 91 }
 92 .comment_btn:hover{
 93 padding: 5px 10px;
 94 height: 35px;
 95 width: 90px;
 96 border: 0 none;
 97 border-radius: 5px;
 98 background: #258fb8;
 99 color: white;
100 cursor:pointer;
101 font-family: "Lato", Helvetica Neue, Helvetica, Microsoft Yahei, 宋体, Arial, sans-serif;
102 text-shadow: 0 0 1px #fff;
103 display: inline !important;
104 }
105 #commentform_title {
106 background-image:none;
107 background-repeat:no-repeat;
108 margin-bottom:10px;
109 padding:0;
110 font-size:24px;
111 }
112 #commentbox_opt,#commentbox_opt + p {
113 text-align:center;
114 }
115 .commentbox_title {
116 width: 100%;
117 }
118 #tbCommentBody {
119 font-family:‘Microsoft Yahei‘, Microsoft Yahei, 宋体, sans-serif;
120 margin-top:10px;
121 max-width:100%;
122 min-width:100%;
123 background:white;
124 color:#333;
125 border:2px solid #fff;
126 box-shadow:inset 0 0 8px #aaa;
127 // padding:10px;
128 height:250px;
129 font-size:14px;
130 min-height:120px;
131 }
132 .feedbackItem {
133 font-size:14px;
134 line-height:24px;
135 margin:10px 0;
136 padding:20px;
137 background:#F2F2F2;
138 box-shadow:0 0 5px #aaa;
139 }
140 .feedbackListSubtitle {
141 font-weight:normal;
142 }
143 
144 #blog-comments-placeholder, #comment_form {
145 padding: 20px;
146 background: #fff;
147 -webkit-box-shadow: 1px 2px 3px #ddd;
148 box-shadow: 1px 2px 3px #ddd;
149 margin-bottom: 50px;
150 }
151 .feedback_area_title {
152 margin-bottom: 15px;
153 font-size: 1.8em;
154 }
155 .feedbackItem {
156 border-bottom: 1px solid #CCC;
157 margin-bottom: 10px;
158 padding: 5px;
159 background: rgb(248, 248, 248);
160 }
161 .color_shine {background: rgb(226, 242, 255);}
162 .feedbackItem:hover {-webkit-animation-name: color_shine;-webkit-animation-duration: 2s;-webkit-animation-iteration-count: infinite;}
163 #comment_form .title {
164 font-weight: normal;
165 margin-bottom: 15px;
166 }

把58行的图片地址换成自己的,可以把图片上传到cnblog的相册,复制图片地址

(3)

在博客皮肤选项里选择自己喜欢的风格,我这里选择的是simplememary,你可以选择自己喜欢的

注意  禁止模板默认CSS  不要勾选,,否则会屏蔽默认的风格

 

(4)

<侧边栏,页首和页脚>的代码,我这里没有定制,保持默认就行了

 

(5)

效果可以进我的博客看一下,目前用的就是这一个

 

 

声明

以上内容参考了网上的教学,感谢网友的分享

 

posted @ 2020-04-15 17:06  万无引力  阅读(415)  评论(1)    收藏  举报