博客主题定制

CSS:

#blogTitle h2 {
    font-weight: normal;
    font-family: "华文楷体",sans-serif!important;
    font-size: .928571429rem;
    line-height: 1.846153846;
    color: #757575;
    float: left;
}
* {
    cursor: url(//www.jvruo.com/curr/normal.cur),auto;
}

/*添加按钮*/
.cnblogs-markdown pre {
  position: relative;
}
.cnblogs-markdown pre > span {
  position: absolute;
  top: 0;
  right: 0;
  border-radius: 2px;
  padding: 0 10px;
  font-size: 12px;
  background: rgba(0, 0, 0, 0.4);
  color: #fff;
  cursor: pointer;
}
.cnblogs-markdown pre > .copyed {
  background: #67c23a;
}

.c_ad_block
 {
 display:none;
 }
/*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;
background-color: #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;
background-color: #f5f5f5;
}
#ad_under_post_holder #google_ad_c1,#google_ad_c2{
display: none !important;
}
body {
color: #000;
background: url(https://s1.ax1x.com/2020/03/14/8MsHPg.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);
}

/*
 代码高亮开始,使用了一个叫Monokai Sublime的黑色主题皮肤,直接拿过来还不行,有一些样式冲突,还要自己稍微改一些地方
Monokai Sublime style. Derived from Monokai by noformnocontent http://nn.mit-license.org/
*/

#navigator {
    font-size: 16px;
    font-family: "仿宋",sans-serif!important;
    border-bottom: 1px solid #ededed;
    border-top: 1px solid #ededed;
    height: 50px;
    clear: both;
    margin-top: 25px;
}/*标题 (新随笔/博客园。。。)*/

.postBody {
    color: #000;
    line-height: 1.7;
    font-size: 16px;
   font-family: "黑体",sans-serif!important;
}/*blog‘s 内容*/
.cnblogs-markdown .hljs, .cnblogs-post-body .hljs {
    font-family: "Consolas",sans-serif!important;
    font-size: 15px !important;
    line-height: 1.5!important;
    padding: 5px !important;
}

/*推荐和反对*/
#div_digg {
    padding: 10px;
    position: fixed;
    _position: absolute;
    z-index: 1000;
    bottom: 20px;
    right: 0;
    _right: 17px;
    border: 1px solid #D9DBE1;
    background-color: #FFFFFF;
    filter: alpha(Opacity=80);
    -moz-opacity: 0.8;
    opacity: 0.8;
}

.icon_favorite {
    background: transparent url(‘t‘) no-repeat 0 0;
    padding-left: 16px;
}
.cnblogs-markdown code, .cnblogs-post-body code {
    font-family: "Consolas",sans-serif !important;
    font-size: 15px !important;
    border: 1px solid #ccc !important;
    border-radius: 3px !important;
    vertical-align: middle;
}/*plain text*/

/*
body {
    font-family: ‘Comic Sans MS‘,sans-serif;
}*/

#MySignature{  
 border:solid 1px #E5E5E5;
 padding:10px;
 background:#E5EEF7 url(http://images.cnblogs.com/cnblogs_com/grenet/226272/o_o_o_info.png) no-repeat scroll 15px 50%;
 padding-left:80px;}

#MySignature div{
  line-height: 20px;
}

侧边公告:

<script type="text/javascript">
/* 鼠标特效 */
var a_idx = 0;
jQuery(document).ready(function($) {
    $("body").click(function(e) {
        var a = new Array("zzt","wsy","wyl","hxy","wzh","ylq","lxk","hzc","leb","lmc","yh","cgy","zjx","syc","zla");
        var $i = $("<span></span>").text(a[a_idx]);
        a_idx = (a_idx + 1) % a.length;
        var x = e.pageX,
        y = e.pageY;
        $i.css({
            "z-index": 999999999999999999999999999999999999999999999999999999999999999999999,
            "top": y - 20,
            "left": x,
            "position": "absolute",
            "font-weight": "bold",
            "color": "rgb("+~~(255*Math.random())+","+~~(255*Math.random())+","+~~(255*Math.random())+")"
        });
        $("body").append($i);
        $i.animate({
            "top": y - 180,
            "opacity": 0
        },
        1500,
        function() {
            $i.remove();
        });
    });
});
</script>

<img src="https://s2.ax1x.com/2020/03/10/8PUhlV.jpg" width="170" height="170" /> 

页脚html:

<script type="text/javascript" language="javascript">
  //Setting ico for cnblogs
  var linkObject = document.createElement(‘link‘);
  linkObject.rel = "shortcut icon";
  linkObject.href = "https://blog-static.cnblogs.com/files/juruo-zzt/ZZT.ico";
  document.getElementsByTagName("head")[0].appendChild(linkObject);
</script>

<script src="https://cdn.bootcss.com/clipboard.js/2.0.4/clipboard.min.js"></script>
<script src="https://blog-static.cnblogs.com/files/wuliytTaotao/cp.js"></script>

原文地址:https://www.cnblogs.com/juruo-zzt/p/12639287.html

时间: 2024-10-17 17:07:16

博客主题定制的相关文章

dajngo ORM查询中select_related的作用,博客主题的定制,从数据库中按照年月筛选时间

1.dajngo ORM查询中select_related的作用 select_related()方法一次性的把数据库关联的对象都查询出来放入对象中,再次查询时就不需要再连接数据库,节省了后面查询数据库的次数和时间.主要用于外键查询. blogobj = Blog.objects.filter(site=site).select_related('user').first() 2.博客主题的定制 将各个模块的css样式固定,然后通过.css文件导入,可以在数据里面设置.css文件的名字在模板中通

博客主题更新了

博客主题更新了 当当当,经过博主一点一点的修改(其实是懒得改),博客主题终于迎来一次重大更新.本来想需要的人自己从控制台扒代码,不打算发布,然而仍有不熟悉前端的同学向我发出请求.本着互联网共享精神,特地发布当前博客主题 注意:Wider本人也不熟悉前端知识,都是平时有时间瞎捣鼓,写的代码冗长且可能存在未知bug,不一定能及时更新哦 特性 加入特色图片 介绍 博客首页文章卡片增加特色图片功能,效果详见我的博客首页,能大幅度增加博客美观度,建议用简单不杂乱的图片. 用法 添加新随笔时,在高级选项中摘

博客入门--自定义博客主题

对于以往博客网站已提出较多主题供用户使用,但对于海量用户而言其主题难免过于单一. 为突出博客主题个性化显示,目前已有第三方开源库(https://github.com/BNDong/Cnblogs-Theme-SimpleMemory)供大家使用.本文以博客园为例,实现自定义主题设置. 进入博客园设置页面 下载第三方库.本文重要使用资源包中的.\src\style\base.min.css的样式资源(https://github.com/BNDong/Cnblogs-Theme-SimpleMe

博客主题美化

1. 博客主题美化 cnblogs是一个老牌博客站点,是一个非常好的记录学习与生活的地方,但是主题看着着实有些年代感,所以找了一些博客主题美化下博客. 首先展示一下修改后的效果 主页效果 侧边栏效果 博客页面效果 2. 需要修改的地方 注意:需要申请JS权限,一般申请后都能通过 博客皮肤 页面定制CSS 禁用模板默认CSS 博客侧边栏公告 3. 修改方法 打开博客设置地址 修改主题为SimpleMemory 选中禁用模板CSS 复制页面定制CSS(请打开复制)到第一个框中 复制侧边栏公告代码到第

记Bili2.0博客主题修改过程

博客主题BiliV2.0更改及优化 主题特色 响应式布局(自适应<360px.<767px的不同尺寸屏幕). 首页全屏背景logo,个性定制. 首页公告消息. 首页轮播,支持定义不同数量的banner. 页脚返回顶部按钮. 博客正文为Github风格Markdown. 博客底部支持博主微信二维码. 博客评论板块调整为发表评论在上,评论列表在下,且评论顺序为倒序,便于查看. 支持博客评论带头像. 博客正文导航目录. 支持切换夜间模式. 支持导航栏扩展. 支持设置博客Tab图标. 支持博客代码块复

Zblog主题模板自适应手机响应式ZblogPHP简洁博客主题

Z-blog PHP版本简洁主题模板 特点简洁舒适 手机移动端自适应,完美有利于优化 代码结构利于编辑 对于不懂代码的,也非常适合简答后台简答 PC端侧边栏下拉跟随,无论下面有多长,导航侧边栏都只在左边:方便你选择栏目 SEO方面代码利于优化. 作者可免费指导安装 对于喜欢简洁的,而又不失丰富的,这是一个不错的选择 对于国产博客程序,zblog无疑是一个佼佼者.wordpress固然强大,可是沉重,买个几百的虚拟主机,差点就转不动.最后放弃选择zblog.一款好的博客主题很重要,早期作者还只是个

从无到有开发自己的Wordpress博客主题---代码环境准备

注意这里说的是代码环境准备哦,而不是L(M)AMP运行环境哦,运行环境会在后述文章中在写. 一.在本地初始化git环境并且链接上gitee 1.在gitee上创建一个项目托管你的代码 这个不在赘述,按照提示一步一步操作就好了,个人用户用gitee的好处是,相比于GitHub速度快,而且可以创建免费的私人库. 2.创建公钥以连接gitee 虽然主流git仓库都支持http的方式,但是每次都要输入密码,麻烦. 创建方式参考:https://gitee.com/help/articles/4181 3

个人博客主题美化

个人博客主题美化 选择主题 Hexo默认的主题是landscape,推荐以下主题: snippet Hiero JSimple BlueLake 详见:https://github.com/search?q=hexo-theme 应用主题 下载主题 将下载好的主题文件夹,粘贴到站点目录的themes下. 更改站点配置文件_config.yml 的theme字段,为主题文件夹的名称: # Extensions## Plugins: https://hexo.io/plugins/## Themes

博客主题分享

(四处codecpy过来的代码,除了一言是我自己写的...) 博客园的主题还是比较自由的... 页面定制CSS代码: #myposts .PostList { background: #000; padding: 20px; /* border: 1px solid #dedede; */ margin: 0 0 -1px 0!important; } .day .postTitle2 { color: #66ccff; } #yiyan{ color:#fff; background:#000