zoukankan      html  css  js  c++  java
  • 博客园代码整理

    页面定制CSS代码

    /*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.90;
                margin: 0 auto;
                 60%;
                min- 950px;
                background-color: #fff;
                padding: 50px;
                margin-top: 80px;
                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;
                 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://files-cdn.cnblogs.com/files/that-boy/bk.bmp) fixed;
                background-size: 100%;
                background-repeat: no-repeat;
                font-family: "Helvetica Neue", Helvetica, Verdana, Arial, sans-serif;
                font-size: 12px;
                min-height: 101%;
                cursor: url('https://blog-static.cnblogs.com/files/SingleWalker/cutecursor.ico'),pointer;
            }
    
            #topics .postTitle {
                border: 0px;
                font-size: 200%;
                font-weight: bold;
                float: left;
                line-height: 1.5;
                 100%;
                padding-left: 5px;
            }
    
            div.commentform p {
                margin-bottom: 10px;
            }
    
            .comment_btn {
                padding: 5px 10px;
                height: 35px;
                 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;
                 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 {
                 100%;
            }
    
            #tbCommentBody {
                font-family: 'Microsoft Yahei', Microsoft Yahei, 宋体, sans-serif;
                margin-top: 10px;
                max- 100%;
                min- 100%;
                background: white;
                color: #333;
                border: 2px solid #fff;
                box-shadow: inset 0 0 8px #aaa;
            / / padding: 10 px;
                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);
            }
    
            .color_shine {
                background: rgb(226, 242, 255);
            }
    
            .feedbackItem:hover {
                -webkit-animation-name: color_shine;
                -webkit-animation-duration: 2s;
                -webkit-animation-iteration-count: infinite;
            }
    
            #comment_form .title {
                font-weight: normal;
                margin-bottom: 15px;
            }
    
    
    
    /*生成博客目录的CSS*/
    #uprightsideBar{
        font-size:16px;
        font-family: 华文楷体;
        text-align:left;
        position:fixed;/*将div的位置固定到距离top:50px,right:0px的位置,这样div就会处在最右边的位置,距离顶部50px*/
        top: 80px;
        right: 20px;
         auto;
        height: auto;
        opacity: 0.7;
    }
    #sideBarTab{
        opacity: 0.8;
        float:left;
        color:#4979ed;
        border-right:none;
        text-align: left;
        font-size:20px;
         25px;
        border-radius: 15px;
        background: white;
        font-family: 华文楷体;
        opacity: 0.8;
    }
    
    #sideBarContents{
        float:left;
        overflow:auto;
        overflow-x:hidden;!important;
         auto;
        min-height:200px;
        max-height: 80%;
        border-right:none;
        color: #4979ed;
        border-radius: 15px;
        background: white;
        font-family: 华文楷体;
    }
    #sideBarContents dl{
        margin: 10px;
        padding: 10px;
        font-family: 华文楷体;
        font-size:18px;
    }
    
    #sideBarContents dt{
        margin-top:10px;
        margin-left:10px;
        font-family: 华文楷体;
        font-size:16px;
        cursor: pointer;
    }
    
    #sideBarContents dd{
        
        margin-left: 45px;
        cursor: pointer;
        font-family: 华文楷体;
        font-size:16px;
    }
    
    #sideBarContents dd:hover, dt:hover {
        color: white;
        border-radius: 15px;
        background: pink;
        font-family: 华文楷体;
        font-size:16px;
        cursor: pointer;
    }
    

    博客侧边栏公告

    <!-- 小人时钟 -->
    <hr>
    <embed allowscriptaccess="never" allownetworking="internal" invokeurls="false" src="https://files.cnblogs.com/files/mmzs/flashDate.swf"
    pluginspage="https://files.cnblogs.com/files/mmzs/flashDate.swf" type="application/x-shockwave-flash" quality="high" autostart="0" wmode="transparent" width="220"
    height="65" align="middle">
    </div>
    <!-- 网易云音乐 -->
    <embed src="//music.163.com/style/swf/widget.swf?sid=546715801&type=2&auto=1&width=320&height=66" width="340" height="86"  allowNetworking="all"></embed>
    <!-- 访客量统计 -->
    <a href="https://github.com/thatboy-zero"><img src="http://47.94.169.95/generatepic?userid=f6ad0ec8-67dc-4e94-9935-d616c088dff4" alt="Page Counter" border="0"></a>
    
    <!-- 看板娘 -->
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>Live2D</title>
    
    <link rel="stylesheet" type="text/css" href="https://blog-static.cnblogs.com/files/that-boy/waifu.css"/>
    <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
    </head>
    <body>
    <div class="waifu" id="waifu">
    <div class="waifu-tips" style="opacity: 1;"></div>
    <canvas id="live2d" width="280" height="250" class="live2d"></canvas>
    <div class="waifu-tool">
    <span class="fui-home"></span>
    <span class="fui-chat"></span>
    <span class="fui-eye"></span>
    <span class="fui-user"></span>
    <span class="fui-photo"></span>
    <span class="fui-info-circle"></span>
    <span class="fui-cross"></span>
    </div>
    </div>
    <script src="https://blog-static.cnblogs.com/files/that-boy/live2d.min.js"> </script> 
    <script src="https://blog-static.cnblogs.com/files/that-boy/waifu-tips.js"> </script>
    <script type="text/javascript">initModel()</script>
    </body>
    </html>
    <link rel="stylesheet" type="text/css" href="https://blog-static.cnblogs.com/files/that-boy/flat-ui.min.css"/>
    

    页首HTML代码

    <!-- 点击文字 -->
    <script type="text/javascript">
    var text_index= 0;
    jQuery(document).ready(function($) {
        $("body").click(function(e) {
            var textsClick = new Array("富强","民主","文明","和谐","自由","平等","公正","法治","爱国","敬业","诚信","友善");
            var $i = $("<span></span>").text(textsClick [text_index]);
            text_index= (text_index+ 1) % textsClick .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>
    <!-- -->
    <script>
      !function(){
      
     function n(n,e,t){
      
     return n.getAttribute(e)||t
      
     }
      
     function e(n){
      
     return document.getElementsByTagName(n)
      
     }
      
     function t(){
      
     var t=e("script"),o=t.length,i=t[o-1];
      
     return{
      
     l:o,z:n(i,"zIndex",-1),o:n(i,"opacity",.5),c:n(i,"color","0,0,0"),n:n(i,"count",99)
      
     }
      
     }
      
     function o(){
      
     a=m.width=window.innerWidth||document.documentElement.clientWidth||document.body.clientWidth,
      
     c=m.height=window.innerHeight||document.documentElement.clientHeight||document.body.clientHeight
      
     }
      
     function i(){
      
     r.clearRect(0,0,a,c);
      
     var n,e,t,o,m,l;
      
     s.forEach(function(i,x){
      
     for(i.x+=i.xa,i.y+=i.ya,i.xa*=i.x>a||i.x<0?-1:1,i.ya*=i.y>c||i.y<0?-1:1,r.fillRect(i.x-.5,i.y-.5,1,1),e=x+1;e<u.length;e++)n=u[e],
      
     null!==n.x&&null!==n.y&&(o=i.x-n.x,m=i.y-n.y,
      
     l=o*o+m*m,l<n.max&&(n===y&&l>=n.max/2&&(i.x-=.03*o,i.y-=.03*m),  
     t=(n.max-l)/n.max,r.beginPath(),r.lineWidth=t/2,r.strokeStyle="rgba("+d.c+","+(t+.2)+")",r.moveTo(i.x,i.y),r.lineTo(n.x,n.y),r.stroke()))
      
     }),
     
     x(i)
      
     }
      
     var a,c,u,m=document.createElement("canvas"),
      
     d=t(),l="c_n"+d.l,r=m.getContext("2d"),
    x=window.requestAnimationFrame||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||window.oRequestAnimationFrame||window.msRequestAnimationFrame||
      
     function(n){
     
     window.setTimeout(n,1e3/45)  
     },
      
     w=Math.random,y={x:null,y:null,max:2e4};m.id=l,m.style.cssText="position:fixed;top:0;left:0;z-index:"+d.z+";opacity:"+d.o,e("body")[0].appendChild(m),o(),window.onresize=o,
      
     window.onmousemove=function(n){
      
     n=n||window.event,y.x=n.clientX,y.y=n.clientY
      
     },
      
     window.onmouseout=function(){
      
     y.x=null,y.y=null
      
     };
      
     for(var s=[],f=0;d.n>f;f++){
      
     var h=w()*a,g=w()*c,v=2*w()-1,p=2*w()-1;s.push({x:h,y:g,xa:v,ya:p,max:6e3})
      
     }
      
     u=s.concat([y]),
      
     setTimeout(function(){i()},100)
      
     }();
      
     </script>
    
    <!-- 离开标题 -->
    <script>
    /* 离开当前页面时修改网页标题,回到当前页面时恢复原来标题 */
    window.onload = function() {
      var OriginTitile = document.title;
      var titleTime;
      document.addEventListener('visibilitychange', function() {
        if(document.hidden) {
          $('[rel="icon"]').attr('href', "https://blog-static.cnblogs.com/files/that-boy/failure.ico");
          $('[rel="shortcut icon"]').attr('href', "https://blog-static.cnblogs.com/files/that-boy/failure.ico");
          document.title = '喔唷,崩溃啦!';
          clearTimeout(titleTime);
        } else {
          //$('[rel="icon"]').attr('href', "/favicon-32x32.ico");
          // $('[rel="shortcut icon"]').attr('href', "/favicon-32x32.ico");
          document.title = '咦,页面又好了!';
          titleTime = setTimeout(function() {
            document.title = OriginTitile;
          }, 2000);
        }
      });
    }
    </script>
    

    页脚HTML代码

    <!-- 雪花 -->
    <script type="text/javascript">
    (function($){
        $.fn.snow = function(options){
        var $flake = $('<div id="snowbox" />').css({'position': 'absolute','z-index':'9999', 'top': '-50px'}).html('&#10052;'),
        documentHeight     = $(document).height(),
        documentWidth    = $(document).width(),
        defaults = {
            minSize        : 5,
            maxSize        : 25,
            newOn        : 500,
            flakeColor    : getRandomColor() /* 此处可以定义雪花颜色,若要白色可以改为#FFFFFF */
        },
        options    = $.extend({}, defaults, options);
        var interval= setInterval( function(){
        var startPositionLeft = Math.random() * documentWidth - 100,
        startOpacity = 0.5 + Math.random(),
        sizeFlake = options.minSize + Math.random() * options.maxSize,
        endPositionTop = documentHeight - 200,
        endPositionLeft = startPositionLeft - 500 + Math.random() * 500,
        durationFall = documentHeight * 10 + Math.random() * 5000;
        $flake.clone().appendTo('body').css({
            left: startPositionLeft,
            opacity: startOpacity,
            'font-size': sizeFlake,
            color: getRandomColor()
        }).animate({
            top: endPositionTop,
            left: endPositionLeft,
            opacity: 0.2
        },durationFall,'linear',function(){
            $(this).remove()
        });
        }, options.newOn);
        };
    })(jQuery);
    $(function(){
        $.fn.snow({ 
            minSize: 5, /* 定义雪花最小尺寸 */
            maxSize: 50,/* 定义雪花最大尺寸 */
            newOn: 150  /* 定义密集程度,数字越小越密集 */
        });
    });
    var getRandomColor = function(){
      return '#'+Math.floor(Math.random()*16777215).toString(16); 
    }
    </script>
    
  • 相关阅读:
    e621. Activating a Keystroke When Any Child Component Has Focus
    e587. Filling Basic Shapes
    e591. Drawing Simple Text
    e595. Drawing an Image
    e586. Drawing Simple Shapes
    e636. Listening to All Key Events Before Delivery to Focused Component
    在 PL/SQL 块的哪部分可以对初始变量赋予新值? (选择1项)
    Oracle数据库中,在SQL语句中连接字符串的方法是哪个?(选择1项)
    你判断下面语句,有什么作用?(单选)
    Oracle数据库表空间与数据文件的关系描述正确的是( )
  • 原文地址:https://www.cnblogs.com/that-boy/p/12335754.html
Copyright © 2011-2022 走看看