2017年1月25日星期三

修改blogger博客css样式

前不久我摸索出了如何修改blogger博客模板并可使国内访问。但是对于模板原生的css样式有细节处还不如我意,但是我对css的调整没有经验,不敢轻易动手修改。后来我发现了谷歌浏览器有一个“检查元素”功能,修改相应部分css参数,可以所见即所得,这样一来,居然将原模板的css修改成了自己喜欢的颜色样式。

一、修改模板颜色。

模板颜色我参照阮一峰博客的颜色,将文章背景、侧边背景及其它背景颜色修改成统一的鹅黄色。修改页面中<url>链接的颜色,参考百度搜索链接的颜色用。

二、修改<li>参数

原模板的<li>的字体、行高、缩进都不美观,经调整后,与文章内容更协调。

三、修改<pre><code><blockquote>参数

原<pre>中文字无法换行,不适宜浏览,现修改后将其调整为自动换行,同时调整背景颜色;<pre>自动折行需要加入以下代码,以适应各浏览器:
white-space:pre-wrap;
white-space:-moz-pre-wrap;
white-space:-pre-wrap;
white-space:-o-pre-wrap;
word-wrap:break-word;
<blockquote>的边框及背景进行美化修改;<code>只对文字增加背景。

四、总结

这次修改基本上达到我的审美要求,将自己平时看到的比较好的网页颜色字体等样式,在自己的博客上实现,对于一个纯粹靠搜索网络信息,依葫芦画瓢的人来讲,也算是不错了。

0 评论:

发表评论

请留下你宝贵的评论。