将你自己博客园博客的主题设置为lessismore,

#divRefreshComments {
text-align: right;
margin-right: 10px;
margin-bottom: 5px;
font-size: 9pt
}
.topicListFooter {
text-align: right;
margin-right: 10px;
margin-top: 10px
}
* {
margin: 0;
padding: 0
}
body {
font-family: "ff-tisa-web-pro-1", "ff-tisa-web-pro-2", "Lucida Grande", "Hiragino Sans GB", "Hiragino Sans GB W3", "Microsoft YaHei", "WenQuanYi Micro Hei", sans-serif;
font-size: 1em;
color: #666666;
-webkit-font-smoothing: antialiased;
background: #fff;
line-height: 1.5
}
img {
border: 0;
max-width: 100%;
}
ul {
list-style-type: disc;
}
ol, ul {
margin: 0 0 1.3em 2.5em;
}
ol li, ul li {
margin: 0 0 .2em 0;
line-height: 1.6em;
}
li p {
margin-bottom: 0;
}
input,textarea {
border: 1px solid #999
}
h1,h2,h3,h4,h5,h6,th {
margin-top: 1.0em;
margin-bottom: .5em;
font-family: "ff-tisa-web-pro-1", "ff-tisa-web-pro-2", "Lucida Grande", "Hiragino Sans GB", "Hiragino Sans GB W3", "Microsoft YaHei", "WenQuanYi Micro Hei", sans-serif;
font-weight: lighter;
color: #333333;
-webkit-font-smoothing: antialiased;
}
a {
text-decoration: none;
color: #bf1827;
}
a:hover {
color: #7b0f19;
-o-transition: .5s;
-ms-transition: .5s;
-moz-transition: .5s;
-webkit-transition: .5s;
}
p {
margin-bottom: 1.3em;
line-height: 1.7em;
}
blockquote {
margin: 1em 0;
background: #f8f8f8;
border: 1px solid #eeeeee;
border-radius: 3px;
font-family: "ff-tisa-web-pro-1", "ff-tisa-web-pro-2", "Lucida Grande", "Hiragino Sans GB", "Hiragino Sans GB W3", "Microsoft YaHei", "WenQuanYi Micro Hei", sans-serif;
font-weight: lighter;
}
blockquote, q {
quotes: none;
}
h1.postTitle {
margin-top: .5em;
font-size: 2.5em;
line-height: 1.2em;
letter-spacing: .05em;
font-weight: normal;
}
#cnblogs_post_body h1 {
font-size: 2.1em;
font-weight: normal;
}
#cnblogs_post_body h2 {
font-size: 2.0em;
font-weight: normal;
}
#cnblogs_post_body h3 {
font-size: 1.6em;
font-weight: normal;
}
.cnblogs-markdown code {
padding: .1em .4em !important;
background-color: #e8f2fb !important;
border: 1px solid #c9e1f6 !important;
border-radius: 3px !important;
font-family: Consolas, Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace, serif !important;
font-size: .9em !important;
vertical-align: bottom !important;
word-wrap: break-word !important;
}
.cnblogs-markdown .hljs {
display: block !important;
overflow-x: auto !important;
padding: .5em !important;
background: #e8f2fb !important;
color: #666 !important;
font-family: Consolas, Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace, serif !important;
font-size: 15px!important;
}
#header {
display: block;
position: fixed;
z-index: 900;
width: 100%;
max-width: none;
height: 100%;
background: url("http://images.cnblogs.com/cnblogs_com/brycezhang/352192/o_background-cover%20(1).jpg") top left no-repeat #666666;
background-size: cover;
width: 30%;
max-width: 500px;
text-align: center;
}
#header a {
color: #FFFFFF;
}
#mainContent {
float: right;
z-index: 800;
width: 70%;
margin-left: 30%;
}
#sideBar {
display: none;
/*position: absolute;
width: 300px;
border-left: 1px solid #ccc;
border-top-width: 0;
overflow: hidden;
padding: 0 8px 20px 30px;
top: 120px;
right: 0*/
}
.forFlow {
margin: 0 80px;
}
#footer {
text-align: center;
border-top: 2px solid #dddddd;
font-size: .7em;
color: #b3b3b3;
margin-left: 30%;
width: 70%;
line-height: 80px;
}
#lnkBlogLogo {
display: none
}
#blogTitle {
padding: 100px 16px;
position: relative;
}
#blogTitle h1 {
font-size: 17pt
}
#blogTitle h2 {
font-size: 10.5pt;
color: #999
}
#blogTitle .title {
font-size: 2.5em;
letter-spacing: 4px;
}
#blogTitle .subtitle {
font-size: 1.2em;
font-weight: lighter;
letter-spacing: 3px;
color: #cccccc;
}
#navigator {
height: 30px;
line-height: 30px;
padding-left: 15px;
padding-right: 5px;
}
#navigator img {
display: none
}
#navigator ul {
margin: 0;
list-style: none;
}
.blogStats {
display: none;
}
#navList li {
display: inline-block;
margin: 5px 1px 0 0;
line-height: 3em;
}
#navList li a {
padding: 10px 20px;
position: relative;
border: 1px solid #FFF;
color: #FFF;
opacity: .8;
border-radius: 20px;
font-size: .9em;
font-weight: bold;
letter-spacing: 1px;
text-shadow: none;
-webkit-font-smoothing: antialiased;
}
#navList li a:hover {
color: #FFF;
border-color: #FFF;
opacity: 1;
}
#sideBar li,.divRecentCommentAticle {
text-indent: -1.5em;
margin-left: 1.5em
}
#sideBar h3,#MyIng .ing_title {
margin: 16px 0 0 0;
font-size: 14px;
text-align: left
}
#calendar {
margin-top: 16px;
text-align: center
}
#calendar table {
width: 90%;
margin: 0 auto
}
#calendar .CalOtherMonthDay {
color: #999
}
#sideBar .divRecentComment {
color: #666;
margin: 0 0 8px 8px
}
#sideBar .recent_comment_body {
color: #666;
margin: 5px 0 8px 18px;
text-indent: 0
}
.ing_title a:link,.ing_title a:visited,.ing_title a:hover,.ing_title a:active {
font-weight: bold
}
div.commentform textarea {
width: 450px;
height: 300px
}
.dayTitle {
display: none
}
.entrylistTitle,.thumbTitle,.PostListTitle,.forFlow h3 div,.galleryTitle {
font-size: 14px;
font-weight: bold;
margin-top: 20px;
text-align: left
}
.entrylistDescription,.thumbDescription {
margin-left: 16px
}
.postTitle,.entrylistPosttitle,.feedback_area_title {
margin-top: 1em;
margin-bottom: .2em;
font-size: 1.5em;
line-height: 1.3em;
}
.postTitle a {
color: #333333;
}
.postTitle a:hover {
color: #7b0f19;
}
.postBody h5 {
font-size: 10pt
}
.postCon {
margin: 0;
font-size: .9em;
color: #999999;
overflow: hidden
}
.postCon a{
border: 1px solid #bf1827;
border-radius: 20px;
padding: 1px 5px;
font-size: .8em;
margin-left: 10px;
}
.postBody a,.feedbackCon a { }
.postCon a:hover,.postBody a:hover,.feedbackCon a:hover {
border-color: #999
}
.postDesc,.entrylistItemPostDesc {
display: block;
margin: .7em 0 0 0;
font-size: .9em;
color: #c7c7c7;
}
.postDesc a:link,.postDesc a:active,.postDesc a:visited {
color: #c7c7c7;
text-decoration: none
}
.postDesc a:hover {
text-decoration: underline
}
.c_b_p_desc {
word-wrap: break-word;
word-break: break-all;
overflow: hidden;
line-height: 1.7;
}
.PostList {
float: none;
clear: both;
text-align: right;
width: 96%;
margin: auto;
padding: 6px 0;
overflow: hidden;
border-bottom: 1px dotted #ccc
}
.postTitl2 {
float: left
}
.postText2 {
text-align: left;
color: #666
}
.feedbackItem {
padding: 8px;
border-bottom: 1px dotted #ccc
}
.feedbackManage {
float: right
}
.feedbackCon {
margin-left: 1em;
color: #666;
line-height: 1.5
}
.commentform td div span {
margin-left: 12px
}
.gallery img {
margin: 8px
}
#taglist {
margin: 20px auto
}
.pfl_feedback_area_title {
font-size: 16px;
margin: 16px 0;
font-weight: bold
}
.pfl_feedback_area_title a {
font-size: 12px;
color: #999;
font-weight: normal
}
.pfl_feedbacksubtitle {
height: 30px
}
.pfl_feedbackname,.pfl_feedbackManage {
float: left;
margin: 10px 20px 0 0
}
.pfl_feedbackCon,.pfl_feedbackAnswer {
clear: both;
margin-left: 12px
}
.btn_my_zzk {
border: 0
}
#sideBarMain {
padding-left: 0
}
#MyIng {
padding-left: 10px
}
div#sideBar div#side_ing_block ul li {
margin-left: 0;
text-indent: 0
}
#side_ing_block {
line-height: 180%
}
#EntryTag {
margin-top: 10px
}
#blog_ad_google h3 {
margin-bottom: 10px
}
#digg_block a:link,#digg_block a:visited,#digg_block a:active {
color: #015fb6
}
#digg_block {
color: #015fb6
}
span.diggnum {
color: #015fb6
}
span.burynum {
color: #015fb6
}
.newsItem p a:link,.newsItem p a:visited {
color: #06c
}
.newsItem p a:hover,.newsItem p a:active {
color: red
}
/*Skins*/
.cover-blue {
background-color: rgba(37, 104, 163, 0.6);
background-image: -webkit-linear-gradient(-410deg, rgba(37, 104, 163, 0.6) 20%, rgba(18, 51, 80, 0.8));
background-image: linear-gradient(140deg,rgba(37, 104, 163, 0.6) 20%, rgba(18, 51, 80, 0.8));
} .cover-green {
background-color: rgba(21, 111, 120, 0.6);
background-image: -webkit-linear-gradient(-410deg, rgba(21, 111, 120, 0.6) 20%, rgba(6, 31, 33, 0.8));
background-image: linear-gradient(140deg,rgba(21, 111, 120, 0.6) 20%, rgba(6, 31, 33, 0.8));
} .cover-purple {
background-color: rgba(73, 50, 82, 0.6);
background-image: -webkit-linear-gradient(-410deg, rgba(73, 50, 82, 0.6) 20%, rgba(17, 11, 19, 0.8));
background-image: linear-gradient(140deg,rgba(73, 50, 82, 0.6) 20%, rgba(17, 11, 19, 0.8));
} .cover-red {
background-color: rgba(119, 31, 18, 0.6);
background-image: -webkit-linear-gradient(-410deg, rgba(119, 31, 18, 0.6) 20%, rgba(30, 8, 5, 0.8));
background-image: linear-gradient(140deg,rgba(119, 31, 18, 0.6) 20%, rgba(30, 8, 5, 0.8));
} .cover-orange {
background-color: rgba(174, 80, 4, 0.6);
background-image: -webkit-linear-gradient(-410deg, rgba(174, 80, 4, 0.6) 20%, rgba(74, 34, 2, 0.8));
background-image: linear-gradient(140deg,rgba(174, 80, 4, 0.6) 20%, rgba(74, 34, 2, 0.8));
} .cover-slate {
background-color: rgba(61, 66, 96, 0.6);
background-image: -webkit-linear-gradient(-410deg, rgba(61, 66, 96, 0.6) 20%, rgba(21, 23, 34, 0.8));
background-image: linear-gradient(140deg,rgba(61, 66, 96, 0.6) 20%, rgba(21, 23, 34, 0.8));
} .cover-disabled {
background: none;
}
.panel-cover--overlay {
display: block;
position: absolute;
z-index: 0;
top: 0;
right: 0;
bottom: 0;
left: 0;
/*background-color: rgba(68, 68, 68, 0.6);
background-image: -webkit-linear-gradient(-410deg, rgba(68, 68, 68, 0.6) 20%, rgba(0, 0, 0, 0.9));
background-image: linear-gradient(140deg,rgba(68, 68, 68, 0.6) 20%, rgba(0, 0, 0, 0.9));*/
}
#under_post_news, #ad_under_post_holder, #opt_under_post, #site_nav_under, #google_ad_c2, #under_post_kb {
display: none;
}
.avatar, .logo {
height: 80px;
border-radius: 50%;
border: 3px solid #FFF;
box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.3);
}
#p_b_follow {
color: #FFF;
opacity: .8;
}
#p_b_follow a:hover{
color: #FFF;
opacity: 1;
}
#cnblogs_post_body h4 {
font-size: 1em;
font-weight: bold;
}

  

然后,禁用模板默认CSS。

接着添加页脚代码,通过JS动态修改左侧cover层的颜色,总共有6种颜色可选,CSS里搜索/*Skins*/即可找到:

<script type='text/javascript'>
(function() {
$('#blogTitle').before('<div class="panel-cover--overlay cover-blue"></div>');// 这里是cover-blue样式,修改为cover-red试试
})();
</script>

  

非常感谢:http://www.cnblogs.com/brycezhang/p/5219510.html

博客 博客vno主题(我正在用的这个博客主题)的更多相关文章

  1. github+hexo搭建自己的博客网站(五)进阶配置(畅言实现博客的评论)

    如何对如何搭建hexo+github可以查看我第一篇入门文章:http://www.cnblogs.com/chengxs/p/7402174.html 详细的可以查看hexo博客的演示:https: ...

  2. 【个人博客 hexo】一个小时就搭好属于自己的博客

    对于经常需要发博客的小伙伴来说,拥有一个属于自己的博客网站,听起来是不是很酷. 今天我就来告诉大家,怎么搭建一个属于自己的博客网站,我们需要的就是使用hexo+github来搭建我们自己博客系统. 你 ...

  3. 搭建自己的博客(九):使用shell模式批量添加博客文章并增加分页功能

    想做个博客分页功能,但是没有太多的文章.所以使用shell命令行创建多篇文章. 1.打开pycharm下的terminal终端 python manage.py shell # 打开python终端 ...

  4. 044. asp.net主题之二为主题添加CSS样式和动态加载主题

    1. 新建任意一个网站, 默认主页为Default.aspx, 增加一个App_Themes目录, 用于存储主题, 添加一个MyTheme的主题, 在MyTheme主题下添加一个样式表文件, 默认名称 ...

  5. codinglife主题小修改和有意思的博客挂件

    这个主题很漂亮,不过为了迎合自己的喜好ヽ(•̀ω•́ )ゝ,修改了字号.阴影之类的小细节.同时下面还有我博客里面的两个有意思的小挂件,请向右边看(๑و•̀ω•́)و 1.主题修改:复制下面的css代码 ...

  6. Eclispse 换主题、皮肤、配色,换黑色主题护眼

    链接地址:http://jingyan.baidu.com/article/6c67b1d68c03be2787bb1ed6.html Eclipse写android代码时,默认的文本和框架都是白色, ...

  7. intellij idea 主题大全,看不惯idea 那2种主题的来这里了

    一直用默认的主题,但是白色的背景看久了会晃眼睛.所以打算换成黑色的. 不过Intellij只有两种主题,Default和Darcula. 现在只能自己手动安装一个了.新主题需要满足, 看久了不会太累. ...

  8. Eclipse 换主题、皮肤、配色,换黑色主题护眼

    Eclipse写android代码时,默认的文本和框架都是白色,长时间使用,显得过于刺眼.这里介绍三种方法换黑色护眼配色. 1.系统设置里更改 2.从Eclipse Marketplace里下载主题 ...

  9. hexo next主题深度优化(九),给博客加入主题,护眼主题,护眼色。

    文章目录 背景 效果 码 _layout.swig custom.styl eye.js 引用eye.js 直接引用 main.js pjax的函数中重写 个人博客:https://mmmmmm.me ...

随机推荐

  1. xcode配置绝对路径与相对路径

     一般我们在xcode里面配置包含工程目录下头文件的时候,都要关联着相对路径和绝对路径,如果只是自己用这个项目,用绝对路径的问题不大,但是如果你把工程发给别人,别人就要在改这个绝对路径,这时候绝对路径 ...

  2. jQuery插件之Cookie插件使用方法~

    一.介绍 1-1.jQuery.Cookie.js插件是一个轻量级的Cookie管理插件.下载地址:jQuery-cookie.js  有需要的朋友,右键另存为即可! 二.使用方法 2-1.引入jQu ...

  3. JSP登录页面使用Enter键登录【转】

    按回车键实现登录   第一种方法:        <html xmlns="http://www.w3.org/1999/xhtml" ><head>  & ...

  4. 网页特效:用CSS3制作3D图片立方体旋转特效

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

  5. 【转载】Python与ArcGIS Engine的集成

    本文转载自Fransico<Python与ArcGIS Engine的集成>   1 在Python中调用AO类库 1.1  准备工作 本文所使用环境:ArcGIS 10.0.Python ...

  6. C语言基础(3)-二进制、八进制、十六进制

    1.二进制 一个位只能表示0或者1两种状态,简称bit(比特) 一个字节为8个二进制数,称为8位,简称BYTE(字节) 一个字为2个字节,简称WORD. 两个字为双字,简称DWORD,占32个bit ...

  7. JSon 对象转字符的一些方法

    引用System.Web.Entity.dll public static string ToJSON(this object obj) { JavaScriptSerializer serializ ...

  8. Windows平台下Qt中glut库的使用

    用Qt中的QGLWidget窗体类中是不包括glut工具库的,难怪在myGLWidget(在我的程序中是QGLWidget的派生类)中绘制实心球体是说“glutSolidSphere”: 找不到标识符 ...

  9. 深度学习入门教程UFLDL学习实验笔记三:主成分分析PCA与白化whitening

    主成分分析与白化是在做深度学习训练时最常见的两种预处理的方法,主成分分析是一种我们用的很多的降维的一种手段,通过PCA降维,我们能够有效的降低数据的维度,加快运算速度.而白化就是为了使得每个特征能有同 ...

  10. jquery-简单拖拽代码

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...