zoukankan      html  css  js  c++  java
  • 我的博客样式

    此文长期更新,具体根据我博客的样式判定.

    架构: BlackLowKey

    页面CSS:

    div.prob{
      box-shadow:0 0 4px #ccf;
      padding: 2px;
      text-align:left;
      border-radius:6px;
    }
    div.prob h2{
      font-size:30px !important;
      font-family:Courier New,微软雅黑;
      font-weight:normal !important;
      text-align:center;
      text-shadow:0 0 1px #888;
    }
    div.prob h3{
      font-size:20px !important;
      font-family:Courier New,微软雅黑;
      font-weight:normal !important;
      border-left:4px solid #39f;
      text-shadow:0 0 1px #aaa;
      padding-left:3px;
    }
    pre.indent,div.indent{
      text-indent:2em;
      font-family:Courier New,宋体;
      text-shadow:0 0 1px #aaa;
    }
    div.prob pre.indent,div.prob div.indent{
      font-size:16px;
    }
    .mono{
      font-family:Monaco,Consolas,Ubuntu Mono;
      padding:5px;
      border:1px solid #ccc;
      border-radius:5px;
      background:#eee;
      text-shadow:0 0 1px #666;
    }
    *::selection{
      background:#acf;
    }
    body,#navigator{
      background:#0068c9;
    }
    #blogTitle h1 a,
      #blogTitle h2,
      #navList a:link,
      #navList hover,
      #navList a:visited,
      #navList a:active{
      text-shadow:none;
      border:none !important;
    }
    .headermaintitle{
      font-size:40px;
    }
    #navList {
      height: 60px;
      float: left;
      margin-left: 0;
       800px;
    }
    #navList li {
      float: left;
      height: 60px;
    }
    #navList li a{
      margin-left: 6px;
    }
    #navList li:hover {
      background:rgba(255,255,255,0.4);
    }
    a:hover,.postCon a:hover{
      text-decoration:none !important;
      border-bottom:2px solid #acf;
    }
    .postCon a:link, .postCon a:visited, .postCon a:active {
      text-decoration: none;
      border-bottom: 2px dashed #acf;
      color:#39f;
      padding-left:0px;
      margin-left: 2px;
    }
    .postTitle,div.newsItem .catListTitle {
      font-size: 14px;
      font-weight: bold;
      padding: 10px 100px 10px 20px;
      background: #E5F0FC;
      line-height: 1.5em;
      clear: both;
      border:none;
      border-left: 5px solid #1fa6e6;
    }
    .newsItem {
      background: #ECF5FF;
      padding: 0 0 5px 0;
      margin-bottom: 2em;
    }
    .cnblogs_Highlighter *{
      font-family:Monaco,Ubuntu Mono,Consolas !important;
    }
    .CalNextPrev{
       20px !important;
      height: 20px !important;
      background: #acf;
      padding: 0 !important;
      font-size: 16px !important;
      text-align: center !important;
    }
    .CalNextPrev:hover{
      background: #39f;
    }
    .CalNextPrev a:hover,.CalNextPrev:hover a{
      color:white;
    }
    .CalTitle{
      background:#acf;
      border:none;
    }
    .Cal tbody tr:nth-child(2){
      background:#cdf;
    }
    .Cal tbody tr:nth-child(1) td{
      padding:0px !important;
    }
    .CalDayHeader{
      border:none;
    }
    .Cal tbody tr:nth-child(n-2) td{
      background:#eef;
    }
    .CalOtherMonthDay{
      background:#def !important;
    }
    .CalWeekendDay{
      background:#4df !important;
    }
    .CalTodayDay{
      background:#aaf !important;
      color:white;
      font-weight:bold;
    }
    input[type="text"]{
      margin:0px;
      border:1px solid transparent;
      border-bottom:1px solid #acf;
    }
    input[type="text"]:hover{
      margin:0px;
      border:1px solid #e7e7e7;
      border-bottom:1px solid #acf;
    }
    input[type="text"]:focus{
      box-shadow:0 0 2px #aaf;
      border:1px solid transparent;
      border-bottom:1px solid #acf;
    }
    input:focus{
      outline:none;
    }
    input[type="button"] {
      margin: 0px;
      border: none;
      background: #29af3f;
      color: white;
      font-weight: bold;
    }
    input[type="button"] {
      margin: 0px;
      border: none;
      background: #198F2D;
      color: white;
      font-weight: bold;
    }
    .catListEssay h3,
     .catListLink h3,
     .catListNoteBook h3,
     .catListTag h3,
     .catListPostCategory h3,
     .catListPostArchive h3,
     .catListArticleArchive h3,
     .catListImageCategory h3,
     .mySearch h3,
     .catListComment h3,
     .catListView h3,
     .catListFeedback h3,
     #blog-sidecolumn .catListTitle {
      font-size: 14px;
      font-weight: bold;
      padding: 10px 100px 10px 20px;
      background: #E5F0FC;
      line-height: 1.5em;
      clear: both;
      border:none;
      border-left: 5px solid #1fa6e6;
    }
    .topicListFooter {
      background: #6EEBCD;
      margin: 0px;
      height: 20px;
      line-height: 20px;
    }
    .topicListFooter a {
      display:inline-block;
      background: #6EEBCD;
      margin: 0px;
      height: 20px;
      line-height: 20px;
    }
    .topicListFooter a:hover {
      display:inline-block;
      background: #3AB194;
      margin: 0px;
      height: 20px;
      line-height: 20px;
      color:white;
      font-weight:bold;
    }
    #comment_nav a {
      padding-left: 0px;
    }
    

     宽屏版。。

    pre{
      font-family:Courier New;
    }
    div.prob{
      box-shadow:0 0 4px #ccf;
      padding: 2px;
      text-align:left;
      border-radius:6px;
    }
    div.prob h2{
      font-size:30px !important;
      font-family:Courier New,微软雅黑;
      font-weight:normal !important;
      text-align:center;
      text-shadow:0 0 1px #888;
    }
    div.prob h3{
      font-size:20px !important;
      font-family:Courier New,微软雅黑;
      font-weight:normal !important;
      border-left:4px solid #39f;
      text-shadow:0 0 1px #aaa;
      padding-left:3px;
    }
    pre.indent,div.indent,p.indent,blockquote.indent{
      text-indent:2em !important;
      font-family:Courier New,宋体;
      text-shadow:0 0 1px #aaa;
    }
    div.prob pre.indent,div.prob div.indent,div.prob blockquote.indent{
      font-size:16px;
    }
    blockquote.indent{
      border-left: 3px solid #999;
      padding-left:2px;
      font-weight:bold;
      color:#444;
    }
    blockquote.indent.noindent{
      text-indent:0px;
    }
    .mono,textarea,.syntaxhighlighter code{
      font-family:Monaco,Consolas,Ubuntu Mono;
      padding:5px;
      border:1px solid #ccc;
      border-radius:5px;
      background:#eee;
      text-shadow:0 0 2px rgba(200,200,200,0.6);
    }
    *::selection{
      background:#acf;
    }
    body,#navigator{
      background:#0068c9;
    }
    #blogTitle h1 a,
      #blogTitle h2,
      #navList a:link,
      #navList hover,
      #navList a:visited,
      #navList a:active{
      text-shadow:none;
      border:none !important;
    }
    .headermaintitle{
      font-size:40px;
    }
    #navList {
      height: 60px;
      float: left;
      margin-left: 0;
       800px;
    }
    #navList li {
      float: left;
      height: 60px;
    }
    #navList li a{
      margin-left: 6px;
    }
    #navList li:hover {
      background:rgba(255,255,255,0.4);
    }
    a:hover,.postCon a:hover{
      text-decoration:none !important;
      border-bottom:2px solid #acf;
    }
    .postCon a:link, .postCon a:visited, .postCon a:active {
      text-decoration: none;
      border-bottom: 2px dashed #acf;
      color:#39f;
      padding-left:0px;
      margin-left: 2px;
    }
    .postTitle,div.newsItem .catListTitle {
      font-size: 14px;
      font-weight: bold;
      padding: 10px 100px 10px 20px;
      background: #E5F0FC;
      line-height: 1.5em;
      clear: both;
      border:none;
      border-left: 5px solid #1fa6e6;
    }
    .newsItem {
      background: #ECF5FF;
      padding: 0 0 5px 0;
      margin-bottom: 2em;
    }
    .cnblogs_Highlighter *{
      font-family:Monaco,Ubuntu Mono,Consolas !important;
    }
    .CalNextPrev{
       20px !important;
      height: 20px !important;
      background: #acf;
      padding: 0 !important;
      font-size: 16px !important;
      text-align: center !important;
    }
    .CalNextPrev:hover{
      background: #39f !important;
    }
    .CalNextPrev a:hover,.CalNextPrev:hover a{
      color:white;
      text-decoration:none !important;
      border:none !important;
    }
    .CalTitle{
      background:#acf;
      border:none;
    }
    .Cal tbody tr:nth-child(2){
      background:#cdf;
    }
    .Cal tbody tr:nth-child(1) td{
      padding:0px !important;
    }
    .CalDayHeader{
      border:none;
    }
    .Cal tbody tr:nth-child(n-2) td{
      background:#eef;
    }
    .CalOtherMonthDay{
      background:#def !important;
    }
    .CalWeekendDay{
      background:#4df !important;
    }
    .CalTodayDay{
      background:#aaf !important;
      color:white;
      font-weight:bold;
    }
    input[type="text"]{
      margin:0px;
      border:1px solid transparent;
      border-bottom:1px solid #acf;
    }
    input[type="text"]:hover{
      margin:0px;
      border:1px solid #e7e7e7;
      border-bottom:1px solid #acf;
    }
    input[type="text"]:focus{
      box-shadow:0 0 2px #aaf;
      border:1px solid transparent;
      border-bottom:1px solid #acf;
    }
    input:focus,textarea:focus{
      outline:none;
    }
    input[type="button"] {
      margin: 0px;
      border: none;
      background: #29af3f;
      color: white;
      font-weight: bold;
    }
    input[type="button"]:hover {
      margin: 0px;
      border: none;
      background: #198F2D;
      color: white;
      font-weight: bold;
    }
    .catListEssay h3,
     .catListLink h3,
     .catListNoteBook h3,
     .catListTag h3,
     .catListPostCategory h3,
     .catListPostArchive h3,
     .catListArticleArchive h3,
     .catListImageCategory h3,
     .mySearch h3,
     .catListComment h3,
     .catListView h3,
     .catListFeedback h3,
     #blog-sidecolumn .catListTitle {
      font-size: 14px;
      font-weight: bold;
      padding: 10px 100px 10px 20px;
      background: #E5F0FC;
      line-height: 1.5em;
      clear: both;
      border:none;
      border-left: 5px solid #1fa6e6;
    }
    .topicListFooter {
      background: #6EEBCD;
      margin: 0px;
      height: 20px;
      line-height: 20px;
    }
    .topicListFooter a {
      display:inline-block;
      background: #6EEBCD;
      margin: 0px;
      height: 20px;
      line-height: 20px;
    }
    .topicListFooter a:hover {
      display:inline-block;
      background: #3AB194;
      margin: 0px;
      height: 20px;
      line-height: 20px;
      color:white;
      font-weight:bold;
    }
    #comment_nav a {
      padding-left: 0px;
    }
    .comment_digg,.comment_bury,.comment_actions a{
      padding: 0px !important;
      margin-left: 5px;
    }
    #navList li a{
      margin:0px;
      padding:20px;
    }
    .statusB{
      display:block;
      border-4px;
      padding:2px;
      border-style:solid;
      border-radius: 10px;
    }
    .statusB.AC{
      border-color:green;
    }
    .statusB.noAC{
      border-color:red;
    }
    .statusB.wait{
      border-color: rgb(255, 163, 0);
      background: rgb(255, 232, 142);
    }
    /*added*/
    #home,#main{
      100%;
    }
    #mainContent{
      80%;
    }
    

    当然了,下次要加上特殊页面的排版要更唯美些.

    todo: * BOOK pages typography

  • 相关阅读:
    ASP.NET安全问题-- 创建安全的Web应用程序
    浅谈ASP.NET内部机制(八)
    ASP.NET 配置文件纵横谈(一)
    项目开发-让设计模式成为一种心智
    浅谈ASP.NET内部机制(七)
    ASP.NET 配置文件纵横谈(二)
    GridView的分页是否真的是鸡肋呢?
    SQL开发中容易忽视的一些小地方(四)
    SQL开发中容易忽视的一些小地方( 三)
    怎样才能充分利用SQL索引
  • 原文地址:https://www.cnblogs.com/tmzbot/p/3933308.html
Copyright © 2011-2022 走看看