我的博客园皮肤代码存储笔记
以下是全站css代码:
#header{display:none;} #main{margin-top:100px;} /** 导航栏 */ #mynavbar{ width: 100%; height: 70px; min-width:550px; position: fixed; display: block; top: 0px; z-index: 100; background-color: white; transition:0.5s ease-in-out; box-shadow: 0 1px 5px rgba(0,0,0,.1); } #mynavbar_menu{ display: inline-block; width: auto; position: relative; float: right; text-align: right; line-height: 68px; } #mynavbar_menu a{ padding: 0 15px; font-size: 16px; outline: 0; color: #313131; text-decoration: none; } #mynavbar_menu a:hover{ color: #eb5055 !important; } #mynavbar span{ text-decoration: none; } #mynavbar span:hover{ color: #1494FB !important; } html { background-color: #eee; } @keyframes fade-in { 0% {opacity: 0;}/*初始状态 透明度为0*/ 40% {opacity: 0;}/*过渡状态 透明度为0*/ 100% {opacity: 1;}/*结束状态 透明度为1*/ } @-webkit-keyframes fade-in {/*针对webkit内核*/ 0% {opacity: 0;} 40% {opacity: 0;} 100% {opacity: 1;} } body{ animation: fade-in;/*动画名称*/ animation-duration: 1.5s;/*动画持续时间*/ -webkit-animation:fade-in 1.5s;/*针对webkit内核*/ } a{ transition: all .3s ease!important } a:link { color: #444; } a:visited { color: #444; } a:hover,#blog_post_info_block a:hover,.postDesc a:hover,#comment_nav a:hover { color: #2D8CF0; } #leftcontentcontainer a{ font-size: 14px; } #leftcontentcontainer a:hover{ font-size:20px !important; } .postBody a{ text-decoration: none !important; color: #2196F3; } .postBody a:hover{ text-decoration:none; color: #0D47A1; } body { background-color: #eee; background: url('//') fixed no-repeat; background-position: 50% 5%; background-size: cover; color: #505050; min-height: 100%; font-family: Georgia,"Times New Roman",Times,sans-serif !important; } #navList a { font-family: unset; } #home { margin: 0 auto; width: 70%; /*原始65*/ /*页面顶部的宽度*/ background-color: rgb(238, 238, 238); padding: 0px; margin-top: 0px; margin-bottom: 0px; } #main { padding-top: 0px; min-width: 0px; } #blogTitle { height: auto; /*高度*/ clear: both; } .forFlow { transition: all 0.5s linear 0s; } #blogTitle { background: #eeeeee; } #blogTitle h1 a { font-family: Lato,"Microsoft Jhenghei","Hiragino Sans GB","Microsoft YaHei",sans-serif; font-size: 36px; font-weight: bold; line-height: 1.5em; /*原始 1.6em*/ margin-top: 10px; /*原始 15px */ color: #333; /*去掉下划线*/ text-decoration: none; } #blogTitle h1 a:hover { color: #03A9F4; /* margin-left: 10px; */ } #blogTitle > h2 { font-size: 17px !important; /*原始 16px ;font-size: 1.0rem;*/ line-height: 1.8; color: #263238; display: none; font-weight: 200; text-align: right; float: right; width: 100%; transition: all 0.5s linear 0s; } #blogTitle > h2:hover { color: #111; margin-right: 10px; } #navigator { background-color: #eee; height: 60px; } /* 导航条 */ #navList a:link, #navList a:visited, #navList a:active { color: #111; font-size: 18px; font-weight: 500; } #navList a:hover { color: white; background-color: #343434; text-decoration: none; text-shadow: 0px 0px 0px 0px #fff; } .blogStats { color: #616161; } .postTitle { border-left: 0px solid #666; font-size: 18px !important; float: right; border-width: 0px; width: 100%; clear: both; margin: 0 0 0 0px; } #topics > div > h1 { width: 95% !important; } .postTitle a:link, .postTitle a:visited, .postTitle a:active { color: #222; font-size: 20px; transition: all 0.4s l*inear 0s; } .postTitle a:hover { margin-left: 30px; color: #2196F3; text-decoration: none; } .postCon { float: right; line-height: 1.5em; width: 100%; clear: both; color: #4d4d4d; padding: 0px 0; } .day .postTitle a { padding-left: 0px; font-size: 1.3em; font-weight: 500; color: #111; padding-bottom: 2px; } .day .postTitle a:hover { color: #2196F3; } .day { background: rgb(238, 238, 238); box-shadow: 0 0 0; margin-bottom: 0; } /*文章附加信息*/ .postDesc { font-weight: 100; line-height: 1.5; padding-top: 0px; padding-bottom: 0px; font-family: unset; clear: both; color: #555 !important; font-size: 0.8em; /*5px padding-left: 90px;posted 发表时间左边距离*/ } .postDesc a:link, .postDesc a:visited, .postDesc a:active { color: #424242; font-weight: 500; } .postDesc a:hover{ color: #03A9F4; } .newsItem, .catListEssay, .catListLink, .catListNoteBook, .catListTag, .catListPostCategory, .catListPostArchive, .catListImageCategory, .catListArticleArchive, .catListView, .catListFeedback, .mySearch, .catListComment, .catListBlogRank, .catList, .catListArticleCategory ,#blog-calendar { background: rgb(238, 238, 238); word-wrap: break-word; margin-bottom: 0; box-shadow: 0 0 0 0; } #sidebar_postcategory > ul > li,#TopViewPostsBlock > ul > li,#TopFeedbackPostsBlock > ul > li,#TopDiggPostsBlock > ul > li { border: 0px; } .CalTitle { background: rgba(255, 255, 255, 0); } .CalTodayDay { /**今天日期样式**/ color: #14242b; } .catListTitle { border-bottom: 0px solid #eee; padding: 0 0 10px 0; text-align: left; color: #666; text-shadow: 0 0 0px; padding-left: 10px; background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAACYElEQVQ4T63Uz2vUQBQH8PedtJoJ6AaEXkU9eChC/wMX7UFaqvTmSY8FKTks3UmKKIuHbrLpoS34owiKVCgFvYgHT2J/+Bu8CCIieFHB26J006KdJ1MaSbvZVMQcJ28+897Lm4D+8wPjRVF0GkClwGYAQbVafbnb+Ztgo9F4QkT3AbzN26C17iOiKwDKSqk3RWia4XNmrgZBsBLH8RlmXldKPcpubDQa55h5CkB/EboNBNBjOgDAtW37iOd537NoGIZnAVwrQreBlmU1tdYrRPQtSZLeWq32a2d5BhVCXNVal4MgaGtRW8lhGB5zHOeD53nrnXoVx/Gw1nqWmU/uRNvA3b5i+t6gzHxDCHF8bGzsfbr+z6ABwjAcBHDTsqwTKZqOzRIRLSqlLhVlGMfxIdM73/dvp3EGFULMbmxslMfHxz+mYB8zPzaz5vv+VB46MTFxwLKsVwBmlFLTaUytVtvjOM4zInqhlBrdBLfS7wWw3AmNomgewGelVDWLSSkfENG+7u7u/kqlkvwBU1QIYW7NZaXUdbMWx3EPM8+1Wq0h27alEOKO1tpbW1v7KqV8CGBvV1fXgMFM/DZw614fBWBmcRONomhaCPFudXV1znGcJWZ+7bqu12w27wHYb9v2qeyItYEZ1GR6USl1a2ttEcCXUql0vhOWm2Han3q9ftiyrKcGBbCgtb4gpZxJkuQuEZWklEN5w5+bYRYVQiwSUZAkybyUcsFgrusOjoyM/MybhkLQbJicnDyotV5m5k9E9MN13eFOWGHJ2dPNQDOz32q1RvN+GNnYXTP827udxv0GjLQoJE1niEMAAAAASUVORK5CYII=) no-repeat scroll 0 50%; font-weight: 100; } #topics { border-bottom: 0px solid #616161; background-color: #eeeeee; padding-top: 0px; box-shadow: 0 0 0 0; font-size: 15px; } .c_ad_block { display: none; } #tbCommentBody { width: 100%; height: 50px; background: rgba(255, 255, 255, 0.5); } #q { background: rgba(255, 255, 255, 0); border-radius: 5px; } .CalNextPrev { background: rgba(255, 255, 255, 0); } /* 图片样式 */ #cnblogs_post_body img { width: auto; height: auto; max-width: 100%; } /*---字体颜色----*/ /*引用*/ .postBody blockquote { color: unset; border-radius: 1px; font-size: 15px; background-color: #e8e8e8; border-width:1px; border-left: 5px solid #9E9E9E; } p { font-size: 1.03em; line-height: 2em; } h2 { font-size: 1.6em !important; line-height: 2.5em !important; border-bottom: 0px solid #BDBDBD; } h3 { font-size: 1.4em !important; line-height: 2.5em !important; } h4 { font-size: 1.2em !important; } h5 { font-size: 1em !important; } h2,h3,h4,h5 { font-family: Lato,"Microsoft Jhenghei","Hiragino Sans GB","Microsoft YaHei",sans-serif; color: transparent; background-color : black; text-shadow : rgba(12, 12, 12, 0.48) 0 5px 6px, rgba(255,255,255,0.2) 1px 3px 3px; -webkit-background-clip : text; } /*公告栏*/ div#profile_block { color: #4d4d4d; } input#btnZzk { border-width: 0px; padding: 5px 5px 20px 5px; color: #fff; border-radius: 5px; background-color: #42A5F5; } input#btnZzk:hover { color: #2196F3; } #profile_block a { /*去掉下划线*/ text-decoration: none; color: #444; } #profile_block a:hover { /*去掉下划线*/ text-decoration: none; color: #2196F3; } .postBody li { font-size: 15px; line-height: 2em; } .postBody { color: #111; padding-top: 0px; } th { min-width: 100px; } div#sidebar_search { background: #fff; border-radius: 10px; } div#sideBar { transition: all 0.5s linear 0s; border-right: 1px solid #e3e5e6; } #footer { min-height: 0px; border-top: 1px solid #f3f3f3; background-color: #fff0; margin-top: 5px; padding-top: 0px; font-size: 12px; margin-bottom: 0px; } #BlogPostCategory { font-size: 15px; font-weight: 500; color: #666; } #post_next_prev { font-size: 14px; font-weight: 500; font-family: unset; color: #969696; } /*---代码块样式---*/ /* 代码高亮开始,使用了一个叫Monokai Sublime的黑色主题皮肤,直接拿过来还不行,有一些样式冲突,还要自己稍微改一些地方 Monokai Sublime style. Derived from Monokai by noformnocontent http://nn.mit-license.org/ */ pre { /*控制代码不换行*/ white-space: pre; word-wrap: normal; } .cnblogs-markdown .hljs { display: block; overflow-x: auto; padding: 0.5em; background: #23241f !important; color: #FFF; white-space: pre; word-break: normal; } .hljs, .hljs-tag, .hljs-subst { color: #f8f8f2; } .hljs-strong, .hljs-emphasis { color: #a8a8a2; } .hljs-bullet, .hljs-quote, .hljs-number, .hljs-regexp, .hljs-literal, .hljs-link { color: #ae81ff; } .hljs-code, .hljs-title, .hljs-section, .hljs-selector-class { color: #a6e22e; } .hljs-strong { font-weight: bold; } .hljs-emphasis { font-style: italic; } .hljs-keyword, .hljs-selector-tag, .hljs-name, .hljs-attr { color: #f92672; } .hljs-symbol, .hljs-attribute { color: #66d9ef; } .hljs-params, .hljs-class .hljs-title { color: #f8f8f2; } .hljs-string, .hljs-type, .hljs-built_in, .hljs-builtin-name, .hljs-selector-id, .hljs-selector-attr, .hljs-selector-pseudo, .hljs-addition, .hljs-variable, .hljs-template-variable { color: #e6db74; } .hljs-comment, .hljs-deletion, .hljs-meta { color: #75715e; } /*黑色主题皮肤结束*/ /*特别的代码块*/ code.hljs.delphi { white-space: pre; color: #fff; background-color: #000 !important; } code.hljs.haskell { white-space: pre; color: #fff; background-color: #000 !important; } /*解决代码块滑动*/ #cnblogs_post_body > pre { overflow-x: auto; } .hljs-comment,.hljs-quote,.hljs-variable { color: #03A9F4 } .hljs-keyword,.hljs-selector-tag,.hljs-built_in,.hljs-name,.hljs-tag { color: #1ee61e } .hljs-string,.hljs-title,.hljs-section,.hljs-attribute,.hljs-literal,.hljs-template-tag,.hljs-template-variable,.hljs-type,.hljs-addition { color: #cc1609; } .hljs-deletion,.hljs-selector-attr,.hljs-selector-pseudo,.hljs-meta { color: #2b91af } .hljs-doctag { color: gray } .hljs-attr { color: #FFC107 } .hljs-symbol,.hljs-bullet,.hljs-link { color: #00b0e8 } /* 定制公告栏时钟位置 */ #clockdiv { text-align: center; } /*目录样式*/ #sideCatalog a { font-size: 12px; font-weight: normal !important; } /*好看的滚动条*/ ::-webkit-scrollbar { width: 8px!important; height: 8px!important; -webkit-appearance: none; } ::-webkit-scrollbar-thumb { height: 5px; border: 1px solid transparent; border-top: none; border-bottom: none; -webkit-border-radius: 6px; background-color: #9e9e9e; background-clip: padding-box; } /*删除点赞按钮*/ #div_digg { display: none !important; } /* 删除反对按钮 */ .buryit { display: none; } /*仿简书按钮*/ /*底部*/ #green_channel { width: 100% !important; display: none; } /*自定义按钮分享*/ #channel { padding: 10px 0; margin-bottom: 10px; margin-top: 10px; border: silver 0px dashed; font-size: 12px; width: 100%; padding-top: 20px; text-align: center; } /* 共同的 */ .btn-pay { transition: all 0.2s linear 0s; padding: 8px 20px; font-size: 15px; display: unset; color: #fff; border-radius: 5px; } .btnz { width: fit-content; margin: 0 auto; background-color: #F44336; } .btnz:hover { background-color: #C62828; } .btng { background-color: #18b566; width: 2%; margin-right: 8px; } .btng:hover { background-color: #1B5E20; } .btns { background-color: #FF5722; margin-right: 8px; width: 2%; } .btns:hover { background-color: #BF360C; } .btnd { background-color: #2196F3; margin-right: 8px; width: 10%; } .btnd:hover { background-color: #1565C0; } #zanp { padding: 0 30px; margin-bottom: 20px; min-height: 24px; font-size: 17px; margin-top: 15px; font-weight: 700; color: #969696; } a.weibo,a.wechat { box-shadow: none; background: none; text-shadow: none; /*border: 1px solid #dcdcdc !important;*/ padding: 20px 9px 4px 9px; border-radius: 50%; } a.wechat > img { width: 24px; } /*作者栏*/ #author_profile { float: left; width: 100% !important; border-radius: 4px; display: none; } /*底部头像旋转*/ .author_avatar { border-radius: 37px; -webkit-transition: transform .4s linear; -moz-transition: transform .4s linear; -o-transition: transform .4s linear; transition: transform .4s linear; } .author_avatar:hover { transform: rotate(360deg); -ms-transform: rotate(360deg); /* IE 9 */ -moz-transform: rotate(360deg); /* Firefox */ -webkit-transform: rotate(360deg); /* Safari 和 Chrome */ -o-transform: rotate(360deg); /* Opera */ } /*分类颜色*/ #blog_post_info_block a { color: #2196F3; text-decoration: none; } /*提交评论*/ .comment_btn { border-width: 0px; padding: 5px 5px 25px 5px; color: #fff; border-radius: 5px; background-color: #2196F3; } .comment_btn:hover { background-color: #54abf1; } .commentbox_title_right { float: left; } div#comment_form { height: auto; background-color: #eeeeee; } #comment_nav a { text-decoration: none; color: #424242; } #commentbox_opt > a { color: #424242; } #commentbox_opt > a:hover { color: #2196F3; text-decoration:none; } #comment_form_container > p:nth-child(4) { color: #9E9E9E; } .commentbox_title_left { color: #9E9E9E; display: none; } #comment_form_container > p:nth-child(8) { color: #9E9E9E; } /*评论*/ div#blog-comments-placeholder { border: none; } #comment_form { font-family:unset !important; } #comment_form_container > p:nth-child(4) { display: none; } div#commentform_title { border-bottom: 0px; } /*设置几个div默认为隐藏状态*/ /*目录*/ #sideToolbar { display: none; } /*广告*/ #ad_t2 { display: none; } /*版权声明*/ div#MySignature { display: block; color: #696969; padding: 0px; border-radius: 5px; font-size: 12px; margin-top: 30px; } #MySignature > div > p { text-indent: 10px; line-height: 1em; color: #111; } .esa-post-signature { padding: 20px 10px 20px 20px; margin-top: 5px; position: relative; margin-left: 5px; border-left-width: 4px; font-size: 14px; line-height: 2; font-family: Lato,"Microsoft Jhenghei","Hiragino Sans GB","Microsoft YaHei",sans-serif!important; border-left-style: solid; background-color: #F5F5F5; border-bottom-right-radius: 2px; border-top-right-radius: 2px; border-left-color: #f66; } .esa-post-signature:before { content: "!"; background-color: #f66; position: absolute; left: -12px; color: #fff; width: 20px; height: 20px; border-radius: 100%; text-align: center; line-height: 20px; font-weight: 700; font-size: 14px; } .esa-post-signature a { color: unset; text-decoration: none !important; } .esa-post-signature a:hover { color: #ff6666 !important; } /*阅读全文*/ a.c_b_p_desc_readmore { border: 0px solid; border-color: #9E9E9E; border-radius: 3px; margin:1px; color: #111; padding: 1px; text-decoration: none !important; } a.c_b_p_desc_readmore:hover { border-color: #03A9F4; color:#03A9F4; } /*评论模板*/ .feedback_area_title { padding:10px; font-size: 1em; font-weight:bold; color: #424242; padding-top: 0px; margin-top: 0px; border-bottom:1px dashed #ccc; } .feedbackListSubtitle { font-size:12px; color:#888; } .feedbackListSubtitle a { color:#888; } .comment_quote { background: #eee; padding: 15px; border: 1px dashed #aaa; border-radius: 5px; } #commentform_title { color: #424242; background-image:none; background-repeat:no-repeat; margin-bottom: 5px; padding: 10px 10px 0px 5px; font-size: 1em; font-weight:bold; border-bottom:1px dashed #ccc; } #comment_form { margin:10px 0; padding: 0px; border-radius: 10px; height: 343px; overflow: hidden; border-width: 3px; border-color: #171515; border-bottom-color: #000; border-width: 50px; } .commentform { margin:10px 0; padding:10px 20px; background: #FFF; } #tbCommentBody { font-family:'MIcrosoft Yahei'; margin-top:10px; background:white; color:#333; border:2px solid #fff; box-shadow:inset 0 0 8px #aaa; height:120px; font-size:14px; min-height:120px; border-radius: 10px; outline:none; } .feedbackItem { font-size:14px; line-height:24px; margin: 0 0; padding: 10px; padding-top:5px; padding-bottom: 0px; } .feedbackListSubtitle { font-weight:normal; } .blog_comment_body > img.user-avatar { position: absolute; left: -72px; top: 0px; width: 48px; height: 48px; } .myself .blog_comment_body > img.user-avatar { left: initial; right: -72px; } #blog-comments-placeholder { border: solid 1px #CCC; border-radius: 5px; } div#comments_pager_top { display: none; } #blog-comments-placeholder > br { display: none; } .feedbackManage { width: 130px; display: none; position: absolute; right: 150px; top: 6px; } .feedbackItem:hover .feedbackManage { display: block; } .feedbackItem a { color: #989898 !important; transition: all .2s; } .feedbackItem a:hover { color: #FF661C !important; text-decoration: underline; } .feedbackCon { background: none; clear: both; border-bottom: 1px solid #e1e1ee; margin: 10px 0 0 5px; padding-top: 0px; } .feedbackListSubtitle a.layer { background: #8BC34A; color: #414141 !important; padding: 2px 4px; border-radius: 2px; margin-right: 4px; /*display: none;*/ } .feedbackListSubtitle a[target="_blank"] { color: #F44336 !important; } .feedbackItem .comment_date { color: #424242; margin-right: 4px; } .feedbackListSubtitle { color: #424242; } .comment_vote { float: right; margin-top: -34px; display: none; } .feedbackItem:hover .comment_vote { display: block; } .feedbackItem { color: #464646; position: relative; } .blog_comment_body { background: #B2E866; float: left; padding: 8px 12px; border-radius: 10px; position: relative; overflow: visible; margin-left: 33px; max-width: 500px; } .blog_comment_body:before { content: ''; display: block; position: absolute; left: -17px; top: 9px; width: 0; height: 0; border-right: solid 18px #B2E866; border-top: solid 6px rgba(0, 0, 0, 0); border-bottom: solid 10px rgba(0, 0, 0, 0); } .blog_comment_body:after { content: attr(data-louceng); display: none; width: 48px; height: 48px; position: absolute; left: -72px; top: 0px; text-align: center; line-height: 48px; font-size: 18px; color: #FFF; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.42); font-family: 'Microsoft Yahei'; background: linear-gradient(top , rgb(116, 218, 45) 12% , rgb(135, 255, 75) 35% , rgb(71, 179, 28) 86%); background: -o-linear-gradient(top , rgb(116, 218, 45) 12% , rgb(135, 255, 75) 35% , rgb(71, 179, 28) 86%); background: -ms-linear-gradient(top , rgb(116, 218, 45) 12% , rgb(135, 255, 75) 35% , rgb(71, 179, 28) 86%); background: -moz-linear-gradient(top , rgb(116, 218, 45) 12% , rgb(135, 255, 75) 35% , rgb(71, 179, 28) 86%); background: -webkit-linear-gradient(top , #74DA2D 12% , #87FF4B 35% , #47B31C 86%); background-size: contain; } #blog-comments-placeholder .feedbackItem:nth-child(10n+0) .blog_comment_body:after { background-image: url(//files.cnblogs.com/files/liuxianan/auto_avatar_00.bmp); } #blog-comments-placeholder .feedbackItem:nth-child(10n+1) .blog_comment_body:after { background-image: url(//files.cnblogs.com/files/liuxianan/auto_avatar_01.bmp); } #blog-comments-placeholder .feedbackItem:nth-child(10n+2) .blog_comment_body:after { background-image: url(//files.cnblogs.com/files/liuxianan/auto_avatar_02.bmp); } #blog-comments-placeholder .feedbackItem:nth-child(10n+3) .blog_comment_body:after { background-image: url(//files.cnblogs.com/files/liuxianan/auto_avatar_03.bmp); } #blog-comments-placeholder .feedbackItem:nth-child(10n+4) .blog_comment_body:after { background-image: url(//files.cnblogs.com/files/liuxianan/auto_avatar_04.bmp); } #blog-comments-placeholder .feedbackItem:nth-child(10n+5) .blog_comment_body:after { background-image: url(//files.cnblogs.com/files/liuxianan/auto_avatar_05.bmp); } #blog-comments-placeholder .feedbackItem:nth-child(10n+6) .blog_comment_body:after { background-image: url(//files.cnblogs.com/files/liuxianan/auto_avatar_06.bmp); } #blog-comments-placeholder .feedbackItem:nth-child(10n+7) .blog_comment_body:after { background-image: url(//files.cnblogs.com/files/liuxianan/auto_avatar_07.bmp); } #blog-comments-placeholder .feedbackItem:nth-child(10n+8) .blog_comment_body:after { background-image: url(//files.cnblogs.com/files/liuxianan/auto_avatar_08.bmp); } #blog-comments-placeholder .feedbackItem:nth-child(10n+9) .blog_comment_body:after { background-image: url(//files.cnblogs.com/files/liuxianan/auto_avatar_09.bmp); } .feedbackCon:after { content: ''; display: block; clear: both; } .comment_quote { border: 1px solid #63921F; border-radius: 3px; } .feedbackItem .sendMsg2This { display: none; } .myself .blog_comment_body { float: right; margin-right: 72px; background: #98DDFF; } .myself .blog_comment_body:before { right: -17px; left: initial; border-left: solid 18px #98DDFF; border-right: none; } .myself .blog_comment_body:after { content: ''; display: none; width: 48px; height: 48px; background-image: url(//pic.cnblogs.com/avatar/352797/20160108090502.png) !important; background-size: contain; position: absolute; right: -72px; top: 0px; left: initial; } .myself .feedbackCon{ margin: 10px 0 0 0px; } .myself .comment_vote { float: left; margin-left: -20px; } .myself .comment_quote { border: 1px solid #4491B7; } .myself .feedbackListSubtitle { float: right; margin-right: 10px; margin-bottom: 10px; } .myself .feedbackListSubtitle a.layer { display: inline-block; } .myself .feedbackManage { left: 66px; right: initial; top: 8px; padding-top:2px; } .feedbackCon img:hover { -webkit-transform: rotateZ(360deg); -moz-transform: rotateZ(360deg); -ms-transform: rotateZ(360deg); -o-transform: rotateZ(360deg); transform: rotateZ(360deg); } .feedbackCon img { border-radius: 40px; -webkit-transition: all 0.6s ease-out; -moz-transition: all 0.5s ease-out; -ms-transition: all 0.5s ease-out; -o-transition: all 0.5s ease-out; transition: all 0.5s ease-out; } /* 结束 */ /*以下锚点*/ #sideToolbar { position: fixed; bottom: -12px; right: 25px; width: 250px; height: 440px } #sideCatalog{ background-color: #eee; padding-bottom:10px; border-radius:5px; } #sideCatalog-sidebar { -moz-border-bottom-colors: none; -moz-border-left-colors: none; -moz-border-right-colors: none; -moz-border-top-colors: none; background-color: #eaeaea; border-color: -moz-use-text-color #eaeaea; border-image: none; border-left: 1px solid #eaeaea; border-right: 1px solid #eaeaea; border-style: none solid; border-width: 0 1px; height: 353px; left: 5px; position: absolute; top: 0; width: 0 } #sideCatalog-catalog { height: 325px; padding-top: 18px; overflow-x: hidden; overflow-y: scroll; padding-left: 23px; position: relative } #sideCatalog #sideCatalog-sidebar .sideCatalog-sidebar-top { cursor: pointer; top: 0 } #sideCatalog #sideCatalog-sidebar .sideCatalog-sidebar-bottom { bottom: 0 } #sideCatalog #sideCatalog-sidebar .sideCatalog-sidebar-top,#sideCatalog #sideCatalog-sidebar .sideCatalog-sidebar-bottom { background: url("//images.cnblogs.com/cnblogs_com/miangao/1001115/o_o_sideToolbar.png") no-repeat scroll 0 -199px transparent; height: 10px; left: -5px; overflow: hidden; position: absolute; width: 10px } #sideCatalog li { margin: 0px; padding: 4px 7px; text-align: left; position: relative } #sideCatalog li: hover { background-color: #f5f5f5 } #sideCatalog-catalog ul .active { background-color: #f5f5f5 } #sideCatalog-catalog .active a { color: #519cea } #sideCatalog-catalog a: hover { color: #519cea } #sideCatalog span: first-child { color: #999; font-family: Arial; font-size: 14px; font-weight: bold; padding-right: 5px } #sideCatalog li.h2Offset { padding-left: 35px; text-indent: -25px } #sideCatalog li.h3Offset { padding-left: 65px; text-indent: -45px } #sideCatalog li.h4Offset { padding-left: 80px; text-indent: -55px } #sideCatalog a { text-decoration: none; color: #424242; font-weight: bold; } .sideCatalog-dot { background: url("//images.cnblogs.com/cnblogs_com/miangao/1001115/o_o_sideToolbar.png") repeat scroll 0 -222px transparent; cursor: pointer; font-size: 12px; height: 10px; left: -10px; line-height: 12px; overflow: hidden; position: absolute; top: 4px; width: 6px } #sideCatalog .highlight .sideCatalog-dot { background: url("//images.cnblogs.com/cnblogs_com/miangao/1001115/o_o_sideToolbar.png") no-repeat scroll -271px -38px transparent; height: 13px; left: -23px; top: 3px; width: 18px } #sideCatalogBtn { background: url("//images.cnblogs.com/cnblogs_com/miangao/1001115/o_o_sideToolbar.png") no-repeat scroll 0 0 transparent; cursor: pointer; display: block; height: 45px; margin-bottom: 5px; margin-left: 5px; position: relative; width: 45px; margin-top: 10px; outline: 0 } #sideCatalogBtn:hover { background: url("//images.cnblogs.com/cnblogs_com/miangao/1001115/o_o_sideToolbar.png") no-repeat scroll -154px 0 transparent; } #sideToolbar-up { background: url("//images.cnblogs.com/cnblogs_com/miangao/1001115/o_o_sideToolbar.png") no-repeat scroll -1px -62px transparent; border-radius: 2px; display: block; height: 45px; margin-left: 5px; width: 45px; outline: 0 } #sideToolbar-up:hover { background: url("//images.cnblogs.com/cnblogs_com/miangao/1001115/o_o_sideToolbar.png") no-repeat scroll -74px -62px transparent } #div_digg{ z-index: 999; } /*自定义新的目录按钮*/ #mulu{ background: url("//images.cnblogs.com/cnblogs_com/miangao/1001115/o_o_sideToolbar.png") no-repeat scroll -104px 0 transparent; width: 45px; height: 45px; overflow: hidden; position: fixed; right: 220px; bottom: 20px; cursor: pointer; display:none; z-index: 999; } #mulu:hover{ background: url("//images.cnblogs.com/cnblogs_com/miangao/1001115/o_o_sideToolbar.png") no-repeat scroll -154px 0 transparent; } /*以上是锚点*/ /*以下是返回顶部*/ #gotop{ background: url("//images.cnblogs.com/cnblogs_com/miangao/1001115/o_o_sideToolbar.png") no-repeat scroll -1px -62px transparent !important; width: 45px; height: 45px; overflow: hidden; position: fixed; right: 166px; bottom: 20px; cursor: pointer; display:none; z-index: 999; } #gotop:hover{ background: url("//images.cnblogs.com/cnblogs_com/miangao/1001115/o_o_sideToolbar.png") no-repeat scroll -74px -62px transparent !important; } /*以上是返回顶部*/
页首html代码:
页脚html代码:
以下是弄好的首页,截图记录:
如图: