如何修改博客園裏我的首頁背景(轉)

原文:http://www.cnblogs.com/cocottt/p/6617421.htmlcss

寫在前面

鑑於日常逛其餘大神的blog的時候,常常看見他們blog上好看的背景。但本身又不知道怎麼弄的,以爲很神奇。直接度娘試了前幾篇發現沒用。因而對着別人blog的網頁源代碼搗騰了一個下午,發現了摸索出了一些奧妙重重的東西,因而就掛到本身blog上給你們分享一下,如侵刪。html

第一步、將所須要的圖片上傳至博客園的服務器上

具體的方法有不少種,如下列舉幾種:web

  1. 發表一篇blog(隨筆),在blog裏面傳上你想要的背景圖片。而後打開那篇blog,開審查元素或對着圖片點複製圖片地址
  2. 直接講圖片傳至相冊上,這種方法我沒試過,不過百度上說應該也是可行的。
    這樣你就將背景上傳至了博客園的服務器而且得到了背景圖片的地址。

第二步、修改博客源碼

這一步比較困難。。。我花了一個下午也基本上是在找這個。。。(由於本身很是弱雞不會HTML因此只能看現成的別人的源碼)
點開博客管理,點設置,而後在頁面定製CSS代碼這個框裏面粘貼上一下代碼:服務器

/*simplememory*/
#google_ad_c1, #google_ad_c2 {display:none;}
.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 { font-size: 14px!important; } #home {
opacity: 0.80; margin: 0 auto; width: 85%; min-width: 950px; padding: 0px; color: green;">#fff;
padding: 30px; margin-top: 30px; margin-bottom: 50px; box-shadow: 0 2px 6px rgba(100, 100, 100, 0.3); } #blogTitle h1 {
font-size: 30px; font-weight: bold; font-family: "Comic Sans MS"; line-height: 1.5em; margin-top: 20px; color: #515151;
} #navList a:hover {
color: #4C9ED9;
text-decoration: none; } #navList a {
display: block; width: 5em; height: 22px; float: left; text-align: center; padding-top: 18px; } #navigator {
font-size: 15px; border-bottom: 1px solid #ededed;
border-top: 1px solid #ededed;
height: 50px; clear: both; margin-top: 25px; } .catListTitle { margin-top: 21px; margin-bottom: 10.5px; text-align: left; border-left: 10px solid rgba(82, 168, 236, 0.8); padding: 10px 0 14px 10px; padding: 0px; color: green;">#f5f5f5;
} #ad_under_post_holder #google_ad_c1,#google_ad_c2{ 
display: none !important; } body { color: #000;
background: url(http://images2015.cnblogs.com/blog/969197/201703/969197-20170325160900815-1058599404.jpg ) fixed; background-size: 100%; background-repeat: no-repeat; font-family: "Helvetica Neue",Helvetica,Verdana,Arial,sans-serif; font-size: 12px; min-height: 101%; } #topics .postTitle {
border: 0px; font-size: 200%; font-weight: bold; float: left; line-height: 1.5; width: 100%; padding-left: 5px; } div.commentform p{ margin-bottom:10px; } .comment_btn { padding: 5px 10px; height: 35px; width: 90px; border: 0 none; border-radius: 5px; background: #ddd;
color: #999;
cursor:pointer; font-family: "Lato", Helvetica Neue, Helvetica, Microsoft Yahei, 宋體, Arial, sans-serif; text-shadow: 0 0 1px #fff;
display: inline !important; } .comment_btn:hover{ padding: 5px 10px; height: 35px; width: 90px; border: 0 none; border-radius: 5px; background: #258fb8;
color: white; cursor:pointer; font-family: "Lato", Helvetica Neue, Helvetica, Microsoft Yahei, 宋體, Arial, sans-serif; text-shadow: 0 0 1px #fff;
display: inline !important; } #commentform_title {
background-image:none; background-repeat:no-repeat; margin-bottom:10px; padding:0; font-size:24px; } #commentbox_opt,#commentbox_opt + p {
text-align:center; } .commentbox_title { width: 100%; } #tbCommentBody {
font-family:'Microsoft Yahei', Microsoft Yahei, 宋體, sans-serif; margin-top:10px; max-width:100%; min-width:100%; background:white; color:#333;
border:2px solid #fff;
box-shadow:inset 0 0 8px #aaa;
// padding:10px; height:250px; font-size:14px; min-height:120px; } .feedbackItem { font-size:14px; line-height:24px; margin:10px 0; padding:20px; background:#F2F2F2;
box-shadow:0 0 5px #aaa;
} .feedbackListSubtitle { font-weight:normal; } #blog-comments-placeholder, #comment_form {
padding: 20px; background: #fff;
-webkit-box-shadow: 1px 2px 3px #ddd;
box-shadow: 1px 2px 3px #ddd;
margin-bottom: 50px; } .feedback_area_title { margin-bottom: 15px; font-size: 1.8em; } .feedbackItem { border-bottom: 1px solid #CCC;
margin-bottom: 10px; padding: 5px; background: rgb(248, 248, 248); } .color_shine {background: rgb(226, 242, 255);} .feedbackItem:hover {-webkit-animation-name: color_shine;-webkit-animation-duration: 2s;-webkit-animation-iteration-count: infinite;} #comment_form .title {
font-weight: normal; margin-bottom: 15px; }

 

找到post

body { color: #000; background: url(http://images2015.cnblogs.com/blog/969197/201703/969197-20170325160900815-1058599404.jpg ) fixed; background-size: 100%; background-repeat: no-repeat; font-family: "Helvetica Neue",Helvetica,Verdana,Arial,sans-serif; font-size: 12px; min-height: 101%; }

這個塊,把http://images2015.cnblogs.com/blog/969197/201703/969197-20170325160900815-1058599404.jpg這一段改爲你本身的背景圖片的地址便可。



google

相關文章
相關標籤/搜索