原来的那个暂时不用了,贴出来一下,有兴趣可以参考,原型是Metro,不要禁用css
改了很多次~
面码大法好!!!
1 /*测试区域*/ 2 3 4 5 6 7 8 9 10 11 /*标题备份*/ 12 h7 { 13 background: #2B6695; 14 border-radius: 6px 6px 6px 6px; 15 box-shadow: 0 0 0 1px #5F5A4B, 1px 1px 6px 1px rgba(10, 10, 0, 0.5); 16 color: #FFFFFF; 17 font-family: "微软雅黑" , "宋体" , "黑体" ,Arial; 18 font-size: 17px; 19 font-weight: bold; 20 height: 25px; 21 line-height: 25px; 22 margin: 18px 0 !important; 23 padding: 8px 0 5px 5px; 24 text-shadow: 2px 2px 3px #222222; 25 } 26 h5{ 27 background: #2B6600; 28 border-radius: 6px 6px 6px 6px; 29 box-shadow: 0 0 0 1px #5F5A4B, 1px 1px 6px 1px rgba(10, 10, 0, 0.5); 30 color: #FFFFFF; 31 font-family: "微软雅黑" , "宋体" , "黑体" ,Arial; 32 font-size: 13px; 33 font-weight: bold; 34 height: 24px; 35 line-height: 23px; 36 margin: 12px 0 !important; 37 padding: 5px 0 5px 10px; 38 text-shadow: 2px 2px 3px #222222; 39 } 40 h3{ 41 text-align:left; 42 box-shadow:3px 3px 2px #888888; 43 width:100%; 44 background-color:#46A3FF; 45 color:#000000; 46 max-width: 700px; 47 } 48 h2{ 49 text-align:left; 50 box-shadow:3px 3px 2px #888888; 51 width:100%; 52 background-color:#BEBEBE; 53 color:#000000; 54 } 55 56 57 58 /*悬浮的那两个玩意儿*/ 59 #div_digg { 60 position: fixed; 61 bottom: 10px; 62 width: 50px; 63 right: 420px; 64 filter: alpha(opacity=20); 65 opacity: 0.60; 66 -moz-opacity: 0.80; 67 border: 2px solid #6FA833; 68 padding: 3px; 69 background-color: #FFF; 70 border-radius: 5px 5px 5px 5px !important; 71 box-shadow: 0 0 0 1px #5F5A4B, 1px 1px 6px 1px rgba(10, 10, 0, 0.5); 72 } 73 #comment_nav { 74 width: 203px; 75 right: 990px; 76 filter: alpha(opacity=20); 77 opacity: 0.60; 78 -moz-opacity: 0.80; 79 margin-right: 0; 80 margin-bottom: 10px; 81 text-align: center; 82 padding-top: 3px; 83 position: fixed; 84 bottom: 10px; 85 padding: 3px; 86 border-radius: 5px 5px 5px 5px !important; 87 box-shadow: 0 0 0 1px #77E0C3, 1px 1px 6px 1px rgba(0, 0, 0, 0.5); 88 padding-bottom: 3px; 89 padding-left: 6px; 90 padding-right: 15px; 91 background-color: green; 92 } 93 94 95 96 /*自制侧边栏*/ 97 98 #cnblogs_post_body { 99 word-break: break-word;100 width: 750px;101 }102 103 #leftcontentcontainer>div {104 border: 1px solid #aaaaaa;105 padding: 15px;106 margin-bottom: 15px;107 }108 109 #MySignature {110 background-color: #f8f8ee;111 border: solid 1px #e8e7d0;112 box-shadow: 0 0 15px #aaa;113 padding: 10px;114 margin-bottom: 10px;115 color: gray;116 width: 725px;117 }118 119 .newsItem {120 border: 1px solid #AAAAAA;121 padding: 15px;122 margin-bottom: 15px;123 }124 125 #mainContent .forFlow {126 width: 750px;127 }128 129 /*透明*/130 #home{131 width:1050px;132 height:auto;133 min-height:250px;/* 必需 */134 _height:250px;/* 必需 */135 overflow:hidden;136 background-color:#FF0000;/* 背景色 */137 }138 #home{139 filter:alpha(opacity=20); /* IE 透明度20% */140 }141 #home{142 background-color:#FFFFFF;143 -moz-opacity:0.80; /* Moz FF 透明度20%*/144 opacity: 0.80; /* 支持CSS3的浏览器(FF 1.5也支持)透明度20%*/145 }146 #home{147 position:absolute;148 }149 /*背景图片*/150 body {151 margin-top: 0px;152 margin-right: auto;153 margin-bottom: 0px;154 margin-left: auto;155 width: 1100px;156 font-size: 12px;157 color: #8F8F8F;158 -moz-opacity:0.8;filter:alpha(opacity=80);159 background-image:url(http://images.cnblogs.com/cnblogs_com/radiumlrb/871769/o_6c224f4a20a44623a7931a289b22720e0cf3d71b.jpg);}160 161 162 /*评论按钮*/163 .comment_btn {164 font-family:'Microsoft Yahei';165 border:none;166 height:48px;167 width:120px;168 font-size:18px;169 cursor:pointer;170 position:relative;171 vertical-align:middle;172 display:inline-block;173 background:#55895B;174 color:#fff;175 }176 177 /*踩一下隐藏*/178 .buryit {179 display:none;180 }181 .diggword {182 display:none;183 }184 #btn_comment_submit:hover {185 background:#6DA47D;186 }187 188 189 /*广告隐藏*/190 .c_ad_block{191 display:none;192 }193 194 195 /*评论标题*/196 .feedback_area_title {197 padding:10px;198 font-size:24px;199 font-weight:bold;200 color:#ffffff;201 border-bottom:solid 6px #ffffff;202 }203 .feedbackListSubtitle {204 font-size:12px;205 color:#888;206 }207 .feedbackListSubtitle a {208 color:#888;209 }210 .comment_quote {211 background:#FCFAAC;212 padding:15px;213 border:1px solid #CCC;214 }215 #commentform_title {216 color:#55895B;217 background-image:none;218 background-repeat:no-repeat;219 margin-bottom:10px;220 padding:10px 20px 10px 10px;221 font-size:24px;222 font-weight:bold;223 border-bottom:solid 6px #55895B;224 }225 /*评论框*/226 #comment_form {227 margin:10px 0;228 padding:0;229 }230 .commentform {231 margin:10px 0;232 padding:10px 20px;233 background:#fff;234 }235 /*评论输入域*/236 #tbCommentBody {237 font-family:'MIcrosoft Yahei';238 margin-top:10px;239 width:730px;240 max-width:940px;241 min-width:640px;242 background:white;243 color:#333;244 border:2px solid #fff;245 box-shadow:inset 0 0 8px #aaa;246 padding:10px;247 height:120px;248 font-size:14px;249 min-height:120px;250 }251 /*评论条目*/252 .feedbackItem {253 font-size:14px;254 line-height:24px;255 margin:10px 0;256 padding:20px;257 background:#F2F2F2;258 box-shadow:0 0 5px #aaa;259 }260 .feedbackListSubtitle {261 font-weight:normal;262 }