效果图:
css代码:
@-moz-document domain("i.cnblogs.com") { /*------------ 博客园后台 css开始 -------------*/ /* 通用 */ html { margin: 0; padding: 0; background:#EEEEEE; } body,body#Articles{ font-size: 14px!important; background:#EEEEEE; margin: 36px 0 5px 0; padding: 0; } iframe { background:#FFFFFF!important; } input[type=text],textarea{ font-family: Microsoft Yahei,Helvetica Neue,Helvetica,Arial,sans-serif!important; color:#252525!important; border: 1px solid #ededed!important; min-height:32px; } select{ min-width: 100px; border: 1px solid #ddd!important; height:32px; appearance:none; -moz-appearance:none; -webkit-appearance:none; background: url("https://images.cnblogs.com/cnblogs_com/webqiand/1381628/o_select.png") no-repeat scroll right center transparent; background-color: #FFF; padding-right: 20px; padding-left:5px; } option{ padding:30px 2px; } input[type="submit"]{ width: auto; height: 38px; line-height: 38px; padding: 0 18px; background-color: #1AA194!important; border: none!important; font-family: Microsoft Yahei,Helvetica Neue,Helvetica,Arial,sans-serif; font-size:14px; letter-spacing: 0; text-align:center!important; color:#FFFFFF!important; border-radius: 6px; cursor: pointer; opacity: .9; filter: alpha(opacity=90); } input[type="submit"]:hover{ opacity: .7; filter: alpha(opacity=70); } #post_list tr,#Listing tr,#Edit_dgrItems tr{ text-align: left; height: 40px; line-height: 40px; vertical-align: middle; } img{ border:none!important; } td,td a{ font-size: 14px!important; } td li,td li a{ font-size: 13px!important; } /* 公共css */ /* 去除背景和边框 */ #main { border: 1px solid transparent; background-color: transparent; } #main,#BodyTable { margin-top:0; border: none; background:#EEEEEE!important; color: #333; position: relative; } td#Header { border: none; } table#BodyTable { border: none; } form { background:#EEEEEE!important; } /* 顶部 */ #blog_top_nav_block, #top_nav{ font-family: Verdana,Arial,Helvetica,sans-serif; font-size:14px; height: 36px; line-height: normal; background: #f8f8f8; border: none; left: 0; top: 0; right: 0; position: absolute; *width: 100%; margin: auto; color: gray; padding:0 5px; overflow: hidden; } #top_nav #left,#blog_top_nav_block #site_nav { height: 36px; line-height: 36px; overflow: hidden; } #blog_top_nav_block a { margin-left: 9px; margin-right: 9px; padding: 0px; font-size: 14px !important; } #site_nav a:first-child{ margin-left:14px; } #site_nav{ padding-left:2px; } #span_userinfo a { margin-left: 3px; margin-right: 3px; } #right, #login_area{ height:36px; line-height: 36px; overflow: hidden; } #main_nav,#SiteNav{ position: absolute; z-index: 10; height:36px; line-height: 36px; padding-top:0; padding-bottom:0; } #main_nav{ top: -36px; right: 250px; } #Header #SiteNav{ top: -34px; right: 230px; padding:0; } #Header #SiteNav a{ padding: 0 8px; } /* 头部 */ td#Header { border-top: none ; } #main_head #SiteTitle,#Header #SiteTitle{ height:90px; line-height:90px; padding-top:0; padding-bottom:0; background-color: #FFF!important; box-shadow:1px 1px 5px rgba(0,0,0,.1); display:flex; align-items: center; margin-bottom: 20px; } #SiteTitle { padding: 0 4px 0 80px; } #Header #SiteTitle{ position: relative; z-index:11; } #blog_title,#BlogTitle{ font-family: Verdana,Arial,Helvetica,sans-serif!important;; position: absolute; right: 20px; top: 20px; padding: 0; margin:0; height:30px; font-size: 20px!important; letter-spacing: 0px; font-weight: bold!important; float: none!important; text-align: right!important; z-index:941; } #BlogTitle{ top: 23px; } #SiteTitle a{ display: block; width: 133px; height:51px; line-height:90px; background-image: url(https://common.cnblogs.com/images/logo/logo20170227.png); background-repeat: no-repeat; background-position: 0% 0px; background-size: 133px auto; overflow: hidden; } #SiteTitle a:hover{ background-color:#FFF; } #SiteTitle a img{ display: none; } #blog_title a, div#BlogTitle a:link{ font-family: Verdana,Arial,Helvetica,sans-serif!important; color: #6b86b3; font-size:18px!important; } /* 导航 */ #tab_nav,ul#TopNav { font-family: Verdana,Arial,Helvetica,sans-serif!important; height: 42px!important; overflow: hidden; border:none!important; position: absolute; letter-spacing: 0px; top: 30px; left: 350px; z-index:1000 } #tab_nav li,#TopNav li{ height: 42px!important; border:none!important; float: left!important; display: block!important; } #TopNav li{ width: auto!important; } #tab_nav li a,#TopNav li a{ font-family: Verdana,Arial,Helvetica,sans-serif!important; display: block!important; height: 42px!important; line-height: 40px!important; border:none!important; padding: 0px 15px!important; background-color: transparent!important; font-size: 16px!important; letter-spacing: 0px; } #tab_nav li a:hover,#TopNav li a:hover{ color: #0099CC!important; } #tab_nav li a.current_nav,#TopNav li a.current_nav{ border-bottom: 2px solid #0099CC!important; } #tab_nav li a.current_nav:hover,#TopNav li a.current_nav:hover{ color: #333!important; } ul#TopNav li{ margin-right:3px; } /* 内容 */ #main_body{ margin: 0px 5px; height: auto; overflow: hidden; } #sub_nav,#SubNav{ display: none; height: 0px!important; overflow: hidden!important; border-color: transparent; border:none!important; padding-bottom: 0px!important; } td.NavHeaderRow { color: inherit; background: none; } #post_list table th, table.Listing th{ border-bottom:1px solid #eee; } #left_container{ margin-top: 0px!important; border-right: 1px solid #eee; width: 250px; background-color: #FFF!important; box-shadow: 0 1px 5px rgba(0,0,0,.1); } #main_container { margin-left: 260px; background-color: #FFF!important; box-shadow: 0 1px 5px rgba(0,0,0,.1); } #main_wrap { margin-left: -260px; } td.NavLeftCell { width: 250px; background-color: #FFF!important; box-shadow: 0 1px 5px rgba(0,0,0,.1); border-left: 5px solid #EEEEEE!important; padding-top: 36px!important } td#Body,#Edit_Contents { border-left: 1px solid transparent; } td#Body #Main{ background-color: #FFF!important; margin-right:5px; margin-left: 10px; box-shadow: 0 1px 5px rgba(0,0,0,.1); } #Editor_Results #Editor_Results_Header{ margin-top:0; } td div#LeftNavHeader { position: absolute; margin-top: 0px!important; margin: 0px; border-right: 1px solid #eee; width: 228px; margin-left: 5px; top: 110px; height: 36px!important; } #content_area{ border-left:none; padding: 10px 0; } #post_list { margin-top:0; margin-left:0; padding: 0; } #post_list td.post-title, #post_list th.post-title{ padding:0 15px!important; } #Body #Main{ padding:0; } #LeftNavHeader,.LeftNavHeader,#left_container h2{ font-weight: bold; height: 36px!important; line-height: 36px!important; border-color: #f2f2f2!important; border-left: 2px solid #009E94!important; padding: 0 10px; background-color: #FAFAFA!important; color: #333!important; font-size: 14px!important; margin-top: 0px!important; } #left_container li,.left_nav li { display: block!important; margin: 0!important; padding: 0!important; height: 32px!important; line-height: 32px!important; font-size: 13px!important; min-width: 130px!important; text-overflow: ellipsis!important; overflow: hidden!important; white-space: nowrap!important; } #left_container li a,.left_nav li a{ color: #333!important; } #LeftNavHeader{ padding-top:0; } #LeftNavHeader h2{ border-top:none; } element.style { font-weight: bold; } #LeftNavHeader, .LeftNavHeader, #left_container h2 { font-weight: bold; height: 36px!important; line-height: 36px!important; border-color: #f2f2f2!important; border-left: 2px solid #009E94!important; padding: 0 10px; background-color: #FAFAFA!important; color: #333!important; font-size: 14px!important; margin-top: 0px!important; } #left_nav h2 { border-top:none; } #Editor_Results_Header,#Edit_Header,#Results_Header,#AddFiles_Header,#Editor_Edit_Header{ margin: 0px; background-color: #FAFAFA; height: 36px; line-height: 36px; border-top: none; border-bottom:1px solid #eee; font-size: 15px; } #post_list table ,table.Listing{ border-bottom: none; } /* 分页 */ .pager,.Pager{ margin: 10px auto; } .pager a,.Pager a{ display: inline-block; background-color: #FFFFFF!important; height: 28px!important; padding: 0px 12px!important; margin: 0px 5px!important; line-height: 28px!important; color: #666666!important; border: 1px solid #CCC!important; cursor: pointer!important; border-radius: 2px!important; } .pager a:hover,.Pager a:hover{ background-color:#FFFFFF!important; color:#00ACF0!important; border: 1px solid #00ACF0!important; } .pager a.current,.Pager a.Current{ color:#FFFFFF!important; border: 1px solid #00ACF0!important; background-color:#00ACF0!important; } .Pager >div{ height: 30px; line-height: 30px; margin-right: 20px!important; } /* 底部*/ #footer,#Footer{ height:90px; border:none!important; box-shadow: 0 1px 5px rgba(0,0,0,.1); text-align: center; padding-top: 40px; } #Footer div{ text-align: center; } #footer a{ color: #333; } table#Footer td { border-bottom: 1px solid transparent; } #Edit_Contents, #Edit_Contents { background:#FFFFFF!important; } /* 链接页 */ #Listing td input[type="submit"]{ padding: 0 8px; height: 26px; line-height: 26px; font-size: 13px; background-color: transparent!important; color: #002C99!important; border: 0px solid #1AA194!important } #Editor_Edit_AdvancedPanelOther_Contents{ display: block!important; } #Configure #Edit_Contents #Edit_lkbPost{ /*保存按钮 */ z-index:200; overflow: hidden; position: fixed; bottom:100px; right:10%; width: 100px; height: 40px; } #Edit{ font-family: Microsoft Yahei,Helvetica Neue,Helvetica,Arial,sans-serif!important; color:#646464!important; font-size: 14px!important; } #Edit textarea{ width:98%!important;; } #Edit #Edit_Contents div{ width:100%!important; } #Edit .infobox{ border-bottom: 1px solid #ccc; padding-bottom: 2px!important; margin-right:5px; color: #666; width:80px!important; } #Edit #Edit_txbPageBeginHtml{ /* #Edit_txbSecondaryCss 为 css框 #Edit_txbPageBeginHtml 为页首Html代码框 #Edit_txbPageEndHtml为页脚Html代码框 */ height:auto!important; min-height:600px; } /* 新增编辑页面 */ #Editor_Edit_APOptions_Header,#Editor_Edit_Advanced_Header,#Editor_Edit_APOptions_Advancedpanel1_Header,#Editor_Edit_APOptions_APSiteCategory_Header,#Results_Add_Header,#AddImages_Header,#Add_Header,#Editor_Edit_AdvancedPanelOther_Header{ margin: 10px 0px 0px 0px; background-color: #FAFAFA; height: 36px; line-height: 36px; border: 1px solid #E8E8E8; } #edit_title b,#edit_body_tip{ height: 30px; line-height: 30px; margin-left: 10px; } #Editor_Edit_Advanced_Contents,#edit_container,#Editor_Edit_APOptions_Contents,#Editor_Edit_APOptions_Advancedpanel1_cklCategories,#Editor_Edit_APOptions_Advancedpanel1_Contents{ background-color: #FFF!important; padding: 0px 10px; } .defaultSkin td.mceToolbar,.mceStatusbar,div#Main div.Edit{ background: #FFF!important; } iframe html{ background: #FFF!important; } #Editor_Edit_txbTitle{ width: 60%!important; } body#tinymce{ background-color:#fff; margin: 0!important; padding: 10px!important; } /* 相册 */ .Header td{ border-bottom: 1px solid #DDD!important; } .ImageThumbnailImage{ padding: 5px; } }
原文:https://www.cnblogs.com/webqiand/p/11737714.html