zoukankan      html  css  js  c++  java
  • 2015/08/11博客园页面(自身)

    --------------------

    页面定制CSS代码

    /*------CSS Code-----------------------------------*/
    .subtitle{
    font-size:200%;
    margin-left:750px;
    margin-top:-30px;
    margin-bottom:-12px;
    font-weight:bold;
    font-family:楷体,"Times New Roman",Georgia,Serif;
    }
    #navigator { background: #222; }
    #navList { font-size: 22px; font-weight:bold;}
    .blogStats { font-size: 12px; }
    #sideBar { 20%; border: none; padding: 0; }
    #sideBar h3 { padding-left: 8px; background-color: #444; }
    #sideBarMain { padding-left: 8px; }
    body { background-color: #002222; color: #ccc; font-size: 14px; }
    h1, h2, h3, h4, h5, h6, th, .feedbackCon, .blogStats { color: #ccc; }
    #main { border: 1px solid #e5e5e5; }
    .day { margin: 20px 0px; }
    .postTitle { padding-left: 20px; font-size: 16px;
    border-bottom-color: #444; }
    .postBody, .postCon { padding: 0px 20px 10px;
    border-bottom: 1px solid #444; }
    .postDesc { padding-right: 20px; }
    a, .postCon a, .postBody a, .feedbackCon a { color: #0dd; }
    a:hover, a:active, a:focus { color: #ff8; text-decoration: none; }
    #navigator, #MySignature, .day, .post { border: 1px solid #e5e5e5;
    border-radius: 8px; box-shadow: 2px 2px 10px #aaa; }
    #navigator { border-radius: 8px 8px 0px 0px; }
    .post { border-right: none; border-top: none;
    border-radius: 0px 0px 8px 8px; padding-top: 1px; }
    .cnblogs_code, .cnblogs_code div {
    color: #000; font-family: consolas, monospace, sans-serif; }

    body
    {
    /*其它主要浏览器不需要这个样式,
    但在IE6/7居中是必须的*/
    text-align:center;
    }
    #home
    {
    /*margin: 0px auto;可以使内容在除IE6/7外的其它
    主要浏览器内居中*/
    margin: 0px auto;
    /*因为body的text-align:center;样式具有继承性,
    所以要重置文本向左对齐*/
    text-align:left;
    max-960px;
    }

    #navigator { height:auto; overflow:hidden; *zoom:1;}
    /*名为.blogStats的div在选择的模板中已经进行了右浮动
    不必再进行设置*/
    #navList { float:left; }
    #navList li { display: inline; float: none; }

    #mainContent { 100%; margin-left: -250px; float: right; }
    #sideBar { 220px; float: left; }
    .forFlow { margin-left:266px; }

    #sideBar { 20%; }
    #mainContent { margin-left: auto; 78%; }
    .forFlow { margin:auto; }

    <!--HTML Code-->
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    @-ms-viewport {
    device-width;
    }
    @media (max-990px) {
    #home{ margin:0 15px; }
    }
    @media (max-640px) {
    #sideBar, #mainContent{ 100%;}
    .post{ border-left:none; }
    }


    <a id="asideAnchor" name="asideAnchor"></a>

    页首Html代码

    <script type="text/javascript">
    $(document).ready(function ()
    {
    var meta = document.createElement("meta");
    meta.name = "viewport";
    meta.content = "width=device-width, initial-scale=1.0";
    $('head').prepend(meta);
    });
    </script>

    页脚Html代码

    <a id="jumpToAside" href="#asideAnchor">跳至侧栏</a>

     

    -----

  • 相关阅读:
    技术债务墙:一种让技术债务可见并可协商的方法
    墙裂推荐
    shell 脚本通过Webhook 发送消息到微信群
    关于中医的一段对话 [ZZ] -- 思维训练故事
    应用深度神经网络预测学生期末成绩
    Python中的模块引用机制
    批量修改含空格的文件名「Linux」
    Markdown数学公式语法
    批处理修改IP
    FTD团队目录
  • 原文地址:https://www.cnblogs.com/Ph-one/p/4721056.html
Copyright © 2011-2022 走看看