博客园设置个人页面

博客园设置个人页面

过了好久才开始修改自己需要的页面，还是要悉心看代码，才能改代码。现在看都的是自己稍微修改过的页面，下面梳理下修改过程：

1.在博客后台设置自己的博客皮肤，选择自己喜欢的。

2.选完皮肤后，可修改页面，如下所示。

3.先修改一下背景图片吧，在相册中，添加一张图片。添加后就是这样。

点击图片可以查看，然后浏览器地址栏中就会出现自己的图片地址，下面会用到。

4.自己不会写，可根据网上人家给的代码，然后自己修改就可以。

#site_nav_under {
　　display: none;
}
.c_ad_block, .ad_text_commentbox {
　　display: none;
　　margin: 0;
　　padding: 0;
}
#ad_under_google {
　　height: 0;
　　overflow: hidden;
}
#ad_under_google a {
　　display: none;
}
#home {
　　margin: 0 auto;
　　width: 65%;
　　min-width: 950px;
　　background-color: #fff;
　　padding: 30px;
　　margin-top: 30px;
　　margin-bottom: 50px;
　　box-shadow: 0 2px 6px rgba(100, 100, 100, 0.3);
}
#blogTitle {
　　height: 60px;
　　clear: both;
}
#navigator {
　　font-size: 13px;
　　border-bottom: 1px solid #ededed;
　　border-top: 1px solid #ededed;
　　height: 50px;
　　clear: both;
　　margin-top: 25px;
}
#blogTitle h1 a{
    color: #4F4F4F;
    text-shadow: 3px 3px 3px #D9D9D9;
}
#blogTitle h2 {
　　font-weight: normal;
　　font-size: 18px;
　　font-size: 1.18571429rem;
　　line-height: 2.546153846;
　　color: #757575;
　　float: left;
　　margin-top: 0.5em;
　　text-shadow: 2px 2px 2px #D9D9D9;
}
body{
　　background-image:url("https://www.cnblogs.com/images/cnblogs_com/wisdomzhang/1402916/o_f9c3475544e884bc01cbce5212829276.jpg");
　　background-repeat:no-repeat;
　　background-size:100%;
　　background-attachment: fixed;
　　filter:alpha(opacity=100); -moz-opacity:1; -khtml-opacity: 1; opacity: 1;
} 

如果不知道怎么该修改那一块，可以打开浏览器的开发者模式，找到需要修改的模块，然后修改对应的参数。即可，fn+f12,

（注意：这个头部有阴影，一开始是白色的，使用的是blogTitle h1修改不过来，仔细查看代码，发现应该使用blogTitle h1 a来修改，标题里面还嵌入了一个链接标签，里面才是文字。）

 5.最后花点时间，理顺自己的页面配色。我就简单的，修改了一下。

最后，给出我参考的博客：

https://www.cnblogs.com/Dillonh/p/8991655.html

https://blog.csdn.net/qq_36346831/article/details/80947660

 

posted @ 2019-02-21 12:52 sky-walker 阅读( ...) 评论( ...) 编辑 收藏