zoukankan      html  css  js  c++  java
  • 对自己的博客园主题稍作修改

    个人对博客园主题做了简单的修改。(这里是在博客园默认主题CodingLife中修改,不禁用模板默认css)

    页面定制的css代码如下

    body{
    background:#eee;
    }
    .catListTitle{
    color:#333 !important;
    background:#fff !important;
    border: 1px solid #dedede !important;
    }
    #sidebar_search{
    display:none;
    }
    .newsItem>.catListTitle{
    display:none;
    }
    .headImage>img{
    border: 3px solid #2586d7;
    border-radius: 50%;
    width: 150px;
    margin: auto;
    display: block;
    }
    #blog-news{
    background:#eee;
    }
    #blogTitle> h2{
    color:#333;
    margin-left:20px;
    top:0px;
    }
    #blogTitle>h1{
    top:0px;
    color:#333;
    }
    #blogTitle h1 a{
    color:#000;
    }
    #blogTitle{
    /*background:url(http://images.cnblogs.com/cnblogs_com/ywb-articles/1456868/o_bg2.jpg) no-repeat center 21px;*/
    background:#eee;
    height:200px;
    }
    #navigator{
    background:#eee;
    border: 1px solid #dedede;
    }
    #navList a {
    color:#333;
    }
    #navList a:link{
    text-shadow:none;
    color:#333;
    }
    #navList a:hover{
    text-decoration:none;
    background-color:#eee;
    color:#169fe6
    }
    .dayTitle{
    background-color:#b9bec1;
    }
    .dayTitle:hover{
    background-color:#6fb2db;
    }
    #profile_block:hover{
    border:1px solid #eee;
    }
    #profile_block{
    color:#333;
    font-weight: bold;
    border:none;
    margin: 0px 50px 0px 50px;
    background:#eee;
    }

    博客侧边栏公告(添加头像)

    <div class="headImage">
        <img src="http://images.cnblogs.com/cnblogs_com/ywb-articles/1456868/o_3.jpg" alt="头像">
    </div>

    首页html代码(时钟)

    <link rel="stylesheet" type="text/css" href="https://blog-static.cnblogs.com/files/ywb-articles/clock.css"/>
    <link rel="stylesheet" type="text/css" href="https://blog-static.cnblogs.com/files/ywb-articles/spiders.css"/>
            <div id="upupoo_bottomLayer">
                    <div id="upupoo_exhibitionLayer_two">
                        <p id="clock">00:00</p>
                        <p id="seconds">00</p>
                        <p id="date">2019/1/1</p>
                    </div>
                </div>
            </div>
    <script src="https://blog-static.cnblogs.com/files/ywb-articles/clock.js" type="text/javascript" charset="utf-8"></script>

    页脚html

    <script src="https://blog-static.cnblogs.com/files/ywb-articles/bootstrap.min.js"></script>
    <link href="https://blog-static.cnblogs.com/files/ywb-articles/myCatalog.css" rel="stylesheet">
    <script type="text/javascript" src="https://blog-static.cnblogs.com/files/ywb-articles/myCatalog.js"></script>
    <style>
    @media screen and (max-767px){
    #blogTitle h1{
      position: static;
      padding-top: 0px;
    }
    }
  • 相关阅读:
    学习笔记——Maven实战(九)打包的技巧
    学习笔记——Maven实战(八)常用Maven插件介绍(下)
    学习笔记——Maven实战(七)常用Maven插件介绍(上)
    学习笔记——Maven实战(六)Gradle,构建工具的未来?
    学习笔记——Maven实战(五)自动化Web应用集成测试
    在Google的GKE上创建支持Internal Load Balancer的Service
    Bash命令查找本机公网IP
    Google Cloud IAM中添加自定义域名
    Debian上启用Apache2服务
    Google Cloud VM上在线扩硬盘
  • 原文地址:https://www.cnblogs.com/ywb-articles/p/10809109.html
Copyright © 2011-2022 走看看