• 设为首页
  • 收藏本站
  • 积分充值
  • VIP赞助
  • 手机版
  • 微博
  • 微信
    微信公众号 添加方式:
    1:搜索微信号(888888
    2:扫描左侧二维码
  • 快捷导航
    福建二哥 门户 查看主题

    Z-BLOG模板CSS默认样式注释大全

    发布者: 酸菜鱼 | 发布时间: 2025-7-24 16:05| 查看数: 80| 评论数: 0|帖子模式

    下面这个是默认的ZBLOG CSS样式表 里面附带有最全的CSS注释 让你一看就理解了。如果您觉得麻烦 可以下载我们提供的样式CSS文件,更加方便您的学习与修改。

    下载地址:default.zip
    /*--------------------------博客全局设置-------------------------------*/

    /*----关于页面的设置[边距、字体颜色、大小、背景颜色]----*/
    body{
    margin:0;
    padding:0;
    color:#000000;
    font-size:12px;
    background:#FFFFFF;
    }
    /*----以下为字体链接变换的定义----*/
    a{
    text-decoration: none;
    }
    a:link {
    color: #095C83;
    }
    a:visited {
    color: #095C83;
    }
    a:hover {
    color: #DC143C;
    text-decoration: underline;
    }
    a:active {
    color: #DC143C;
    text-decoration: underline;
    }

    /*----以下为ul li 段落 图片的定义----*/
    ul{
    list-style-type:none;
    list-style-position : outside;
    margin:0 0 0 0;
    padding:0 0 0 0;
    word-break:break-all;
    }
    li{
    margin:0 0 0 0;
    padding:0 0 0 0;
    }
    p{
    margin:0 0 0 0;
    padding:0 0 0 0;
    word-break:break-all;
    }
    img{
    border:0;
    }

    /*--------------------------------3个主要div模块的定义-------------------------------*/

    #divAll{
    width:790px;
    margin:0 auto;
    padding:0
    }
    #divPage{
    width:778px;
    margin:0;
    padding:0 6px 0 6px;
    text-align:left;
    float:left;
    background:url("default/bg.gif") repeat-y center;
    }
    #divMiddle{
    width:778px;
    margin:0;
    padding:0;
    text-align:left;
    float:left;
    }

    /*----顶部图片的大小、边距、颜色、背景的定义----*/
    #divTop{
    width:778px;
    margin:0 auto;
    padding:0;
    text-align:left;
    float:left;
    height:115px;
    background:#1D99D3 url("default/topbacking.gif") repeat-x 0 0;
    border-bottom:1px solid #808080;
    }

    /*----侧栏宽度、边距、浮动位置的定义----*/
    #divSidebar{
    width:210px;
    margin:0 0 0 0;
    padding:0 0 10px 0;
    text-align:center;
    float:left;
    }

    /*----主栏栏宽度、边距、浮动位置的定义----*/
    #divMain{
    width:568px;
    margin:0 0 0 0;
    padding: 0;
    text-align:left;
    float:left;
    }

    /*----底部大小、边距、浮动位置、背景的定义----*/
    #divBottom{
    width:778px;
    margin:0 auto;
    padding:0;
    text-align:center;
    float:left;
    height:80px;
    background:url("default/bottom.png") repeat-x 0 0;
    border-top:1px solid #D0D0D0;
    }
    /*----------------------------侧栏模块的参数定义-----------------------------------*/

    /*----侧栏总体定义[浮动方向、宽度、边距等]----*/
    div.function {
    float:left;
    width:190px;
    margin:10px 0 0 0;
    padding:0 0 0 10px;
    text-align:left;
    }

    /*----侧栏标题的定义----*/
    div.function h3{
    font-size:12px;
    height:15px;
    margin:0 0 0 0;
    padding:5px 0 0 5px;
    color:black;
    }
    /*----侧栏正文的定义----*/
    div.function ul{
    text-align:left;
    width:190px;
    margin:2px 0 0 0;
    padding:5px 0 0 0;
    list-style-positionutside;
    list-style-type:none;
    border-top:1px solid #d0d0d0;
    }
    /*----侧栏正文项目列表的定义----*/
    div.function li{
    margin:0 0 0 0;
    padding:2px 0 1px 15px;
    background:url("default/pointblue.gif") no-repeat 3px 4px;
    }
    /*----侧栏项目列表的定义----*/
    #divCatalog li{
    background:none;
    padding:2px 0 1px 4px;
    }
    /*#divCatalog li span.feed-icon{
    display:none;
    }*/
    /*----侧栏图标汇集的定义----*/
    #divMisc{
    padding:10px 0 5px 10px;
    }

    /*----侧栏图标汇集的标题隐藏----*/
    #divMisc h3{
    display: none;
    }

    /*----侧栏图标汇集的正文模块定义----*/
    #divMisc ul{
    border:none;
    }

    /*----侧栏图标汇集的项目列表定义----*/
    #divMisc li{
    padding:2px 0 2px 15px;
    background-image : none;
    }

    /*----侧栏目录项目前的图标----*/
    div.function li span.feed-icon a{
    background:url("default/feed.png") no-repeat 0 3px;
    margin:0 0 0 0;
    padding:0 0 0 0;
    font-size:14px;
    height:12px;
    width:12px;
    }
    div.function li span.feed-icon img{
    height:12px;
    width:9px;
    visibility:hidden;
    margin:0;
    padding:0;
    }

    /*----侧栏控制面板的项目列表定义----*/
    #divContorPanel li{
    background-image : none;
    }

    /*----侧栏搜索的项目列表定义----*/
    #divSearchPanel li{
    background-image : none;
    }

    /*-----------------------------主栏正文的定义----------------------------------*/

    /*----正文的总体定义----*/
    div.post {
    width:548px;
    margin:10px 0 10px 10px;
    padding:0 0 0 0;
    text-align:left;
    }
    /*----上下文章的总体定义----*/
    div.post-nav {
    width:100%;
    clear:both;
    float:left;
    }
    /*----上文的定义----*/
    div.post-nav a.l{
    float:left;
    padding-right:10px;
    padding-bottom:5px;
    }
    /*----下文的定义----*/
    div.post-nav a.r{
    float:right;
    padding-left:10px;
    padding-bottom:5px;
    }
    /*----文章标题的定义----*/
    div.post .post-title{
    width:519px;
    padding:5px 0 2px 28px;
    margin:2px 0 2px 0;
    font-size:18px;
    color: #284259;
    border-top:1px dashed #D0D0D0;
    border-bottom:1px dashed #D0D0D0;
    background:#fafafa url("default/title-bg.gif") no-repeat 3px center;
    }
    /*----文章日期的定义----*/
    div.post .post-date{
    width:538px;
    margin:0 0 0 0;
    padding:5px 5px 2px 0;
    font-size:12px;
    color:gray;
    }
    /*----文章底部的定义----*/
    div.post .post-footer{
    width:546px;
    margin:10px 0 30px 0;
    padding:2px 0 0 0;
    font-size:12px;
    color:gray;
    height:20px;
    text-align:right;
    }
    /*----tags的定义----*/
    div.post .post-tags{
    width:541px;
    margin:2px 0 2px 5px;
    padding:2px 0 0 0;
    font-size:12px;
    color:gray;
    height:20px;
    text-align:left;
    }
    body.multi div.post .post-tags{
    /*display:none;*/
    }
    /*----文章正文文字的定义----*/
    div.post div.post-body{
    width:520px;
    margin:0 0 0 0;
    padding:0 0 0 5px;
    font-size:13px;
    word-break:break-all;
    text-align:left;
    line-height:150%;
    }
    /*----文章正文内media标签的定义----*/
    div.post-body div.media a{
    padding-left:16px;
    background:#FBFBFB url("default/media.gif") no-repeat 0 center;
    }
    /*----文章img标签的定义----*/
    div.post-body img{
    padding:4px 4px 4px 4px;
    border:0;
    clear : both;
    float : none;
    }
    /*----文章正文段落的定义----*/
    div.post-body p{
    margin:10px 0 15px 0;
    padding:0;
    }
    /*----文章正文文字段落内img标签的定义----*/
    div.post-body p.img{
    margin:0;
    padding:0;
    text-align:center;
    }
    /*----文章正文文字段落内inscript标签的定义----*/
    div.post-body p.inscript{
    margin:0;
    padding:0;
    padding-right:20px;
    text-align:right;
    }
    /*----文章正文文字段落内code标签的定义----*/
    div.post-body p.code{
    padding:5px;
    border:1px dotted black;
    }
    div.post-body div.code{
    padding:5px;
    border:1px dotted black;
    }
    /*----文章正文内h1标签的定义----*/
    div.post-body h1{
    color: #000000;
    margin:0;
    padding:0;
    font-size:16px;
    }
    /*----文章正文内h2标签的定义----*/
    div.post-body h2{
    color: #000000;
    margin:0;
    padding:0;
    font-size:14px;
    }
    /*----文章正文内h3标签的定义----*/
    div.post-body h3{
    color: #000000;
    margin:0;
    padding:0;
    font-size:13px;
    }
    /*----文章正文内h4标签的定义----*/
    div.post-body h4{
    color: #000000;
    margin:0;
    padding:0;
    font-size:12px;
    }
    /*----文章正文内h5标签的定义----*/
    div.post-body h5{
    color: #000000;
    margin:0;
    padding:0;
    font-size:11px;
    }
    /*----文章正文内h6标签的定义----*/
    div.post-body h6{
    color: #000000;
    margin:0;
    padding:0;
    font-size:10px;
    }
    /*--------------------------blog名称及版权的定义-------------------------------------*/
    /*----blog名称的总体定义----*/
    #BlogTitle{
    font-size:32px;
    margin:54px 0 0 10px;
    padding:0;
    font-weight:bold;
    }

    /*----以下为blog名称的链接变换定义----*/
    #BlogTitle a{
    color:#F0FFF0;
    }
    #BlogTitle a:hover {
    color: #DC143C;
    text-decoration: none;
    }
    #BlogTitle a:active {
    color: #DC143C;
    text-decoration: none;
    }

    /*----blog名称下副标题的定义----*/
    #BlogSubTitle{
    color: #F0FFF0;
    font-size:12px;
    margin:2px 0 0 10px;
    padding:0;
    }
    /*----blog版权的定义----*/
    #BlogPowerBy{
    font-size:12px;
    height:20px;
    margin:0;
    padding:25px 10px 0 10px;
    text-align:right;
    font-weight:normal;
    }
    #BlogCopyRight{
    font-size:12px;
    height:20px;
    margin:0;
    padding:0 10px 0 10px;
    text-align:right;
    float:none;
    clear:both;
    font-weight:normal;
    }

    /*--------------------------评论的定义-------------------------------------*/

    /*----评论顶部部分的定义----*/
    p.posttop {
    margin:10px 0 0 0;
    padding:3px 0 2px 12px;
    background: url("default/pointblue.gif") no-repeat 0 center;
    }
    /*----评论底部部分的定义----*/
    p.postbottom {
    margin:0 0 10px 0;
    padding:5px 0 0 0;
    }
    #frmSumbit{
    padding:0;
    margin:0;
    }
    #frmSumbit p{
    padding:5px 0 5px 0;
    }
    /*----评论按钮的定义----*/
    input.button{
    background: white;
    border: 1px double #284259;
    color: #333;
    padding: 0.05em 0.25em 0.05em 0.25em;
    }
    /*----评论文字的定义----*/
    input.text {
    padding: 0.15em 0.25em 0.20em 0.25em;
    border: 1px double #284259;
    width: 200px;
    background: white;
    }
    /*----评论文字框的定义----*/
    textarea.text {
    padding: 0.15em 0.25em 0.20em 0.25em;
    border: 1px double #284259;
    width: 80%;
    height: 80px;
    background: white;
    width: 520px;
    height: 120px;
    }


    /*---------------------------侧栏日历的定义------------------------------------*/
    /*----日历的总体定义----*/
    #divCalendar{
    padding:0 0 0 10px;
    text-align:center;
    }
    /*----日历标题部分进行了隐藏----*/
    #divCalendar h3{
    display:none;
    }
    /*----日历div的定义----*/
    #divCalendar div{
    margin:0 0 0 0;
    padding:0 0 5px 4px;
    float:left;
    }
    /*----日历各月份背景图片的定义----*/
    #divCalendar div.month1{
    background:url("default/month1.gif") no-repeat center 10px;
    }
    #divCalendar div.month2{
    background:url("default/month2.gif") no-repeat center 10px;
    }
    #divCalendar div.month3{
    background:url("default/month3.gif") no-repeat center 10px;
    }
    #divCalendar div.month4{
    background:url("default/month4.gif") no-repeat center 10px;
    }
    #divCalendar div.month5{
    background:url("default/month5.gif") no-repeat center 10px;;
    }
    #divCalendar div.month6{
    background:url("default/month6.gif") no-repeat center 10px;
    }
    #divCalendar div.month7{
    background:url("default/month7.gif") no-repeat center 10px;
    }
    #divCalendar div.month8{
    background:url("default/month8.gif") no-repeat center 10px;
    }
    #divCalendar div.month9{
    background:url("default/month9.gif") no-repeat center 10px;
    }
    #divCalendar div.month10{
    background:url("default/month10.gif") no-repeat center 10px;
    }
    #divCalendar div.month11{
    background:url("default/month11.gif") no-repeat center 10px;
    }
    #divCalendar div.month12{
    background:url("default/month12.gif") no-repeat center 10px;
    }
    /*----日历各月份背景图片的定义----*/
    p.w{
    float:left;
    width:25px;
    height:16px;
    margin:4px 0 0 0;
    padding:2px 0 1px 0;
    text-align:center;
    vertical-align :middle;
    font-size:9px;
    text-decoration : underline; 
    }
    /*----日历年份的定义----*/
    p.y{
    text-align:center;
    height:14px;
    margin:2px 0 0 0;
    padding:0 0 0 0;
    float:left;
    width:175px;
    font-size:12px;
    font-weight:bold;
    }
    /*----日历日期的定义----*/
    p.d{
    float:left;
    width:25px;
    height:18px;
    margin:0 0 0 0;
    padding:2px 0 0 0;
    text-align:center;
    vertical-align :middle;
    }

    /*----有文章的日期的定义----*/
    p.yd{
    float:left;
    width:25px;
    height:18px;
    margin:0 0 0 0;
    padding:2px 0 0 0;
    text-align:center;
    vertical-align :middle;
    font-weight:bolder;
    color:#6090c0;
    background: url("default/links_r.gif") no-repeat 1px 1px;
    }

    /*----没有文章的日期的定义----*/
    p.nd{
    float:left;
    width:25px;
    height:18px;
    margin:0 0 0 0;
    padding:2px 0 0 0;
    text-align:center;
    vertical-align :middle;
    }

    /*----当日日期的定义----*/
    p.cd{
    float:left;
    width:25px;
    height:18px;
    margin:0 0 0 0;
    padding:2px 0 0 0;
    text-align:center;
    vertical-align :middle;
    font-weight:bold;
    }

    /*---------------------------相关文章和引用的定义------------------------------------*/
    ul.msg{
    width:548px;
    margin:10px 0 40px 10px;
    padding:0 0 0 0;
    text-align:left;
    list-style-position : outside;
    }
    li.msgname{
    padding:2px 0 2px 5px;
    margin:0px;
    border-bottom:1px dashed #D0D0D0;
    }
    li.tbname{
    padding:0 0 0 5px;
    margin:0px;
    border-bottom:1px dashed #D0D0D0;
    }
    li.msgurl{
    text-align:right;
    padding:2px 10px 2px 10px;
    margin:0;
    border-left:1px dashed #D0D0D0;
    border-right:1px dashed #D0D0D0;
    }
    li.msgarticle{
    list-style-position : outside;
    padding:15px 10px 15px 10px;
    margin:0;
    line-height:150%;
    border-left:1px dashed #D0D0D0;
    border-right:1px dashed #D0D0D0;
    }

    /*----发表时间的定义----*/
    li.msgtime{
    text-align:right;
    padding:2px 5px 0 10px;
    margin:0 0 0 0;
    border-bottom:1px dashed #D0D0D0;
    border-left:1px dashed #D0D0D0;
    border-right:1px dashed #D0D0D0;
    }

    /*----引用的列表名字----*/
    ul.trackback li.tbname{
    border-bottom:none;
    background: url("default/pointblue.gif") no-repeat 0 center;
    padding:3px 0 2px 12px;
    margin:0px;
    }

    /*----引用的定义----*/
    ul.trackback{
    margin:5px 0 10px 10px;
    }
    /*----相关文章的定义----*/
    ul.mutuality{
    margin:5px 0 10px 10px;
    border-bottom:1px dashed #D0D0D0;
    }

    /*----相关文章名称的定义----*/
    ul.mutuality li.tbname{
    background: url("default/pointblue.gif") no-repeat 0 center;
    padding:3px 0 2px 12px;
    margin:0px;
    border:none;
    }
    /*----相关文章的列表----*/
    ul.mutuality li.msgarticle{
    background:#ffffff;
    padding:0 10px 10px 16px;
    border:none;
    }

    /*-------------------留言回复的定义------------------------------*/
    li.msgarticle div.quote{
    padding:10px;
    background:#f0f0f0;
    }
    li.msgarticle div.quote-title{
    margin:2px;
    padding:3px;
    font-size:120%;
    border-bottom:1px #f8f8f8 solid;
    }

    /*--------------------------导航栏的定义-------------------------------------*/

    /*----导航栏的大小、背景总体定义----*/
    #divNavBar{
    float:left;
    width:778px;
    border-bottom:1px solid #C0C0C0;
    background:url("default/navbg.gif") repeat-x 0 0;
    height:24px;
    }

    #divNavBar h3{
    display:none;
    }
    #divNavBar ul{
    margin:0;
    padding:0;
    }

    /*----导航栏项目列表的定义----*/

    #divNavBar li{
    float:left;
    padding:0 0 0 0;
    margin:0 0 0 0;
    font-family:"宋体","黑体";
    background:url("default/navbg2.gif") no-repeat right 0;
    }

    /*----以下为导航栏小项目的链接变换样式----*/

    #divNavBar a{
    float:left;
    margin:0;
    padding:6px 10px 4px 10px;
    height:14px;
    text-decoration: none;
    }
    #divNavBar a:link {
    color: black;
    }
    #divNavBar a:visited {
    color: black;
    }
    #divNavBar a:hover {
    color: white;
    background:#DC143C;
    }
    #divNavBar a:active {
    color: white;
    background:#DC143C;
    }

    来源:互联网
    免责声明:如果侵犯了您的权益,请联系站长(1277306191@qq.com),我们会及时删除侵权内容,谢谢合作!

    最新评论

    QQ Archiver 手机版 小黑屋 福建二哥 ( 闽ICP备2022004717号|闽公网安备35052402000345号 )

    Powered by Discuz! X3.5 © 2001-2023

    快速回复 返回顶部 返回列表