博客园登录页面html,打造自己的博客园页面

刚接触博客园时，总有一种要定制打造自己博客页面的冲动，后来感觉原有的模板足够了(博客园提供了大量的模板)，没有做这项工作。今天不太忙，稍微研究了下博客园的页面定制功能，记录如下。

首先，园子里大都是技术宅，大家分享知识，界面在一定程度上并不太重要。而且这里做Web前端的也大有人在，这里分享的知识只是入门级，大牛可跳过了，不喜勿喷吧。

博客园提供给用户大量的博客模板供选择，并在这些模板的基础上，允许用户进行一定的定制。当然，这种定制是有限的，主要包括以下几个方面：通过CSS代码定制代码页面风格、博客侧边栏公告、页首页脚Html代码以及标题和子标题。博客主页中打开“管理”-“设置”即可见。

1.标题和子标题显示在页面顶部(blogTitle)

 

这部分比较简单，大家可修改尝试。

2.通过CSS代码定制代码页面风格

通过CSS修改页面风格部分是定制个人界面的关键。CSS层叠样式表，它可以通过选择器来设置HTML页面中标签、类、id及伪元素的属性。

要想设置CSS样式，我们需要知道博客页面中有哪些HTML标签、类，即要找到我们要修改的那部分页面对应的HTML标签是什么。这样便需要查看网页HTML源码，在Chrome浏览器中，在要修改的地方右击选择“审查元素”即可。这里为了方便，我在火狐浏览器下通过FireBug插件来查看源码，FireBug功能非常强大，这里有点大材小用了。

首先，对于页面顶部对应源码为：

侯凯