Nice,博客园的CSS 花了一天终于弄完了。
暑假 + 开学前半个月 学了CSS,本来想学Web安全的,结果其他很多东西学了很多,Web安全没太学(汗)
原来的模板是 SimpleMemory
直接把默认CSS禁用了,不然一堆冲突
CSS还有很多要学的,还有很多待完善的
自己感觉非常好看,嘿嘿嘿
---
又拿手机试试,发现原来的模板还有mobile版的,有点不兼容,不知道怎么办,只能用 !important 了
---
晚上发现标签页、分页、归档页面等等还没实现,就又弄了一晚上,今天一天都没学别的,啧啧
半夜又改了
---
2018/12/19
想改一下代码,有点乱。冗余,又删除了一部分。
---
2019/8/21
好像SimpleMemory这个模板改了几个ID,然后有些东西失效了
---
2020/09/26 评论区
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td{ margin: 0; padding:0; } img{ max- 700px !important; } body{ 1200px; margin: 0 auto; color: #666; background-color: rgb(250, 250, 250); font-family: "consolas","微软雅黑",sans-serif; } *::selection{ background-color: rgb(214,236,254); } ul{ list-style: none; } .clear{ clear:both; } #lnkBlogLogo{ display: none; } #home{ margin: 80px 0 30px 0; padding: 40px; background-color:rgba(232,232, 232, 0.5); border-radius: 5px; box-shadow: 0 0 10px 0 rgba(218, 218, 218, 0.397); } #main{ background-color:rgba(232,232, 232, 0); } /*【导航】 [start]*/ #header{ height: 104px; background-color:rgba(232,232, 232, 0); border-radius: 5px; } #blogTitle{ margin-top: 10px; height: 60px; border-radius: 5px; } #blogTitle h1{ margin: 8px 0 0 20px; display: inline-block; } #blogTitle h2{ color: #999; margin-left: 10px; display: inline-block; font-size: 20px; } #blogTitle .headermaintitle{ color: #888; letter-spacing: 1px; } #blogTitle .headermaintitle:hover{ color: rgb(74, 82, 109); } #navigator{ height: 50px; background-color: rgba(240, 240, 240, 0.5); border-radius: 5px; box-shadow: 0 0 6px 0 #ddd; } #navList li{ float: left; margin: 13px 0 0 40px; } #navList li:nth-child(1){ margin-left: 20px; } #navList li a{ color: rgb(63, 125, 187); text-decoration: none; font-size: 18px; font-weight: bold; } #navList li a:hover{ color: #369; } #header .blogStats{ float: right; margin: 15px 10px 0 0; color: #369; font-size: 17px; } /*【导航】 [end]*/ #mainContent{ border-radius: 5px !important; 840px !important; float: left !important; margin-top: 30px; padding: 10px; box-sizing: border-box; box-shadow: 0 0 6px 0 #ddd; } /*【右侧栏】 [start]*/ /**/ #blog-calendar tr:not(:first-child) td:not(.CalTodayDay) a{ padding: 3px 5px 3px 5px; background-color: #A0D3FF; color: #fff; border-radius: 45px; } #blog-calendar .CalTitle a:hover{ background-color: #eee; } #blog-calendar td{ 30px; height: 25px; } #blog-calendar .CalTitle{ margin-bottom: 10px; } #blog-calendar .CalTitle td:nth-child(2){ 100px; font-size: 18px; } #blog-calendar .CalTodayDay{ background-color: rgb(201, 201, 201); border-radius: 45px; } #blog-calendar .CalTodayDay a{ color: #fff ; text-decoration: none; } #blog-calendar .CalTodayDay u{ text-decoration: none; } #blog-calendar .CalTitle a{ color: #666; text-decoration: none; font-size: 20px; font-weight: bold; padding: 3px 8px 3px 8px; border-radius: 3px; } /**/ #sideBar{ 260px !important; float: right !important; border-radius: 5px !important; box-sizing: border-box; margin-top: 30px !important; background-color:rgba(232,232, 232, 0); border-radius: 5px; } .catListTitle{ color: rgb(36, 114, 192); padding: 6px; text-indent: 5px; background-color:rgba(232,232, 232, 0.5); border-bottom: 1.2px dashed #ccc; letter-spacing: 3px; } .newsItem .catListTitle{ margin: 0; } #profile_block{ margin-left: 20px; } #profile_block a{ text-decoration: none; color: #369; font-size: 16px; padding: 4px 8px 4px 8px; border-radius: 3px; display: inline-block; } #profile_block a:hover{ background-color: rgb(236, 236, 236); } .newsItem{ border-bottom: 1.2px dashed #ccc; padding-bottom: 1px; box-shadow: 0 0 6px 0 #ddd; } #blog-calendar{ padding: 10px 20px 10px 20px; box-shadow: 0 0 6px 0 #ddd; } .mySearch{ margin-top: 29px; box-shadow: 0 0 6px 0 #ddd; padding-bottom: 10px; } #sidebar_shortcut{ margin-top: 30px; box-shadow: 0 0 6px 0 #ddd; padding-bottom: 10px; } #sidebar_recentposts,#sidebar_topviewedposts, #sidebar_topcommentedposts, #sidebar_recentcomments, #sidebar_postarchive,#sidebar_topdiggedposts { margin-top: 30px; box-shadow: 0 0 6px 0 #ddd; padding-bottom: 1px; } #sidebar_recentposts ul,#sidebar_topviewedposts ul, #sidebar_topcommentedposts ul, #sidebar_recentcomments ul, #sidebar_postarchive ul,#sidebar_topdiggedposts ul{ margin: 10px; } #sidebar_recentposts li a, #sidebar_topviewedposts li a, #sidebar_topcommentedposts li a, #sidebar_recentcomments li a, #sidebar_postarchive li a,#sidebar_topdiggedposts li a{ text-decoration: none; color: #369; font-size: 16px; padding: 4px 8px 4px 8px; border-radius: 3px; display: block; } #sidebar_recentposts li a:hover,#sidebar_topviewedposts li a:hover, #sidebar_topcommentedposts li a:hover, #sidebar_recentcomments li a:hover, #sidebar_postarchive li a:hover,#sidebar_topdiggedposts li a:hover{ background-color: rgb(236, 236, 236); } #sidebar_toptags { margin-top: 30px; box-shadow: 0 0 6px 0 #ddd; padding-bottom: 10px; } #sidebar_scorerank { margin-top: 30px; box-shadow: 0 0 6px 0 #ddd; } #mainContent, #sidebar_scorerank,#sidebar_search,#sidebar_toptags,#sidebar_recentposts,#sidebar_shortcut,#blog-calendar,.newsItem,#sidebar_topviewedposts, #sidebar_topcommentedposts,#sidebar_postarchive,#sidebar_topdiggedposts, #sidebar_recentcomments{ background-color:rgb(252, 252, 252); } #sidebar_search_box .input_my_zzk{ outline: none; 150px !important; height: 25px; border: 1.1px solid #ccc; margin: 10px 0 0 10px; border-radius: 3px; } #sidebar_search_box .input_my_zzk:focus{ border-color: rgb(126, 185, 253); } #sidebar_search_box .btn_my_zzk{ outline: none; border: none; background-color: rgb(59, 142, 236); color: #fff; letter-spacing: 2px; border-radius: 2px; height: 28px; line-height: 31px; position: relative; top: 1.3px; text-align: center; 83px; font-size: 16px; box-shadow: 1px 1px 0.5px 0 #aaa; cursor: pointer; } #sidebar_search_box .btn_my_zzk:active{ background-color: rgb(30, 125, 233); } .catListLink li{ margin: 10px 0 0 27px; display: inline-block; } .catListLink li a{ text-decoration: none; color: #369; font-size: 16.5px; padding: 4px 8px 4px 8px; border-radius: 3px; } .catListLink li a:hover{ background-color: rgb(236, 236, 236); } .catListTag ul{ margin: 10px; border-radius: 5px; } .catListTag li{ margin: 0; } .catListTag li::before{ content: "•"; color: #333; } .catListTag li a{ text-decoration: none; color: #369; font-size: 16.5px; padding: 4px 8px 4px 8px; border-radius: 3px; display: inline-block; } .catListTag li:hover{ background-color: rgb(236, 236, 236); } .catListBlogRank{ padding-bottom: 6px; color: #369; } .catListBlogRank li{ margin: 6px 0 0 20px; } /*【右侧栏】 [end]*/ /*【主体】 [start]*/ .dayTitle{ padding-bottom: 10px; border-bottom: 2px solid #ccc; margin: 20px 0 20px 0; font-weight: bold; font-size: 25px; } .dayTitle a{ color: #369; text-decoration: none; } .postTitle{ margin-bottom: 6px; font-weight: bold; font-size: 21px; } .postTitle::before{ content: "#"; font-size: 30px; /*font-style: italic;*/ color: rgb(34, 144, 253); position: relative; font-weight: bold; } .postTitle a{ color: rgb(36, 114, 192); text-decoration: none; } .postCon{ padding: 8px; color: #666; box-shadow: 0 0 5px 0 #ddd; background-color: rgb(242, 242, 242); border-radius: 3px; } .postDesc{ margin-bottom: 50px; margin-top: 7px; color: #999; font-size: 17px; } .postDesc a,.postCon a{ font-size: 17px; color: rgb(1, 179, 179); text-decoration: none; margin-left: 3px; } .postDesc a:hover,.postCon a:hover{ color: rgb(3, 145, 145); text-decoration: underline; } #cnblogs_post_body { line-height:30px; } /*【pager】*/ #homepage_top_pager{ display: none; } /* #mainContent > div > div:nth-child(4){ display:none; } */ .pager{ font-size: 17.5px; margin: 3px 0; line-height: 100%; } .topicListFooter{ position: relative; left: 85px; 650px; border-radius:5px; padding: 5px 0 5px 10px; } .topicListFooter a{ color: #666; text-decoration: none; background-color: #ddd; display: inline-block; padding: 6px 8px 6px 8px; border-radius: 4px !important; border:none !important; } /**/ /*【footer】*/ #footer{ position: relative; top: 25px; } /*【底部推荐之类的】*/ #under_post_news,#under_post_kb, #ad_t2{ display:none; } /*【归档页面】*/ .entrylistTitle{ padding-bottom: 10px; border-bottom: 2px solid #ccc; margin: 20px 0 20px 0; font-weight: bold; font-size: 25px; } .entrylistTitle a{ color: #369; text-decoration: none; } .entrylistPosttitle{ margin-bottom: 6px; font-weight: bold; font-size: 20px; } .entrylistPosttitle::before{ content: "# "; font-size: 30px; font-style: italic; color: rgb(34, 144, 253); position: relative; font-weight: bold; } .entrylistPosttitle a{ color: rgb(36, 114, 192); text-decoration: none; } .entrylistPostSummary{ padding: 8px; color: #666; box-shadow: 0 0 5px 0 #ddd; background-color: rgb(242, 242, 242); border-radius: 3px; } .entrylistItemPostDesc{ margin-bottom: 30px; color: #999; font-size: 17px; } .entrylistItemPostDesc a, .entrylistPostSummary a{ font-size: 17px; color: rgb(1, 179, 179); text-decoration: none; margin-left: 3px; } .entrylistItemPostDesc a:hover,.entrylistPostSummary a:hover{ color: rgb(3, 145, 145); text-decoration: underline; } /*【标签页】*/ .myposts_title{ font-size: 23px !important; margin-top: 10px; } .postDesc2 { float: right; font-size: 16px !important; } .postTitl2{ font-size: 18px; } .postTitl2 a { text-decoration: none; color: #666; } .postTitl2 a:hover{ color:#aaa; } .postTitl2::before { content: "# "; color: #4C99F8; font-size: 24px; font-weight: bold; } .postTitle a { color: rgb(36, 114, 192); text-decoration: none; } /*【Tag列表页】*/ #taglist_title{ font-size: 23px; } #MyTag1_dtTagList a{ text-decoration: none; color: #369; font-size: 20px; } #MyTag1_dtTagList a:hover{ color:#2381df; } /*【代码字体】*/ .code { font-family: consolas !important; font-size: 16px !important; } /*【评论区】*/ .feedbackItem { padding-bottom: 10px; padding-top: 10px; border-bottom: 2px solid #ccc; margin-bottom: 5px; } .feedbackItem a, #comment_nav a, #commentbox_opt a, #blog_post_info_block a{ color: #369; text-decoration: none; background-color: #F0F0F0; display: inline-block; padding: 2px 5px 2px 5px !important; border-radius: 3px; margin-left: 5px; margin-top: 3px; } .feedbackItem a:hover, #comment_nav a:hover, #commentbox_opt a:hover, #blog_post_info_block a:hover{ background-color: #ddd; } .feedbackListSubtitle { border-bottom: 2px dashed #ddd; padding-bottom: 5px; margin-bottom: 10px; margin-left: 10px; margin-right: 10px; } .layer { border-radius: 100px !important; padding: 5px; color: #fff !important; background-color: #369 !important; } .feedbackManage{ padding-left: 15px; display: inline-block; float:right; }