--------------------
页面定制CSS代码
/*------CSS Code-----------------------------------*/
.subtitle{
font-size:200%;
margin-left:750px;
margin-top:-30px;
margin-bottom:-12px;
font-weight:bold;
font-family:楷体,"Times New Roman",Georgia,Serif;
}
#navigator { background: #222; }
#navList { font-size: 22px; font-weight:bold;}
.blogStats { font-size: 12px; }
#sideBar { 20%; border: none; padding: 0; }
#sideBar h3 { padding-left: 8px; background-color: #444; }
#sideBarMain { padding-left: 8px; }
body { background-color: #002222; color: #ccc; font-size: 14px; }
h1, h2, h3, h4, h5, h6, th, .feedbackCon, .blogStats { color: #ccc; }
#main { border: 1px solid #e5e5e5; }
.day { margin: 20px 0px; }
.postTitle { padding-left: 20px; font-size: 16px;
border-bottom-color: #444; }
.postBody, .postCon { padding: 0px 20px 10px;
border-bottom: 1px solid #444; }
.postDesc { padding-right: 20px; }
a, .postCon a, .postBody a, .feedbackCon a { color: #0dd; }
a:hover, a:active, a:focus { color: #ff8; text-decoration: none; }
#navigator, #MySignature, .day, .post { border: 1px solid #e5e5e5;
border-radius: 8px; box-shadow: 2px 2px 10px #aaa; }
#navigator { border-radius: 8px 8px 0px 0px; }
.post { border-right: none; border-top: none;
border-radius: 0px 0px 8px 8px; padding-top: 1px; }
.cnblogs_code, .cnblogs_code div {
color: #000; font-family: consolas, monospace, sans-serif; }
body
{
/*其它主要浏览器不需要这个样式,
但在IE6/7居中是必须的*/
text-align:center;
}
#home
{
/*margin: 0px auto;可以使内容在除IE6/7外的其它
主要浏览器内居中*/
margin: 0px auto;
/*因为body的text-align:center;样式具有继承性,
所以要重置文本向左对齐*/
text-align:left;
max-960px;
}
#navigator { height:auto; overflow:hidden; *zoom:1;}
/*名为.blogStats的div在选择的模板中已经进行了右浮动
不必再进行设置*/
#navList { float:left; }
#navList li { display: inline; float: none; }
#mainContent { 100%; margin-left: -250px; float: right; }
#sideBar { 220px; float: left; }
.forFlow { margin-left:266px; }
#sideBar { 20%; }
#mainContent { margin-left: auto; 78%; }
.forFlow { margin:auto; }
<!--HTML Code-->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
@-ms-viewport {
device-width;
}
@media (max-990px) {
#home{ margin:0 15px; }
}
@media (max-640px) {
#sideBar, #mainContent{ 100%;}
.post{ border-left:none; }
}
<a id="asideAnchor" name="asideAnchor"></a>
页首Html代码
<script type="text/javascript">
$(document).ready(function ()
{
var meta = document.createElement("meta");
meta.name = "viewport";
meta.content = "width=device-width, initial-scale=1.0";
$('head').prepend(meta);
});
</script>
页脚Html代码
<a id="jumpToAside" href="#asideAnchor">跳至侧栏</a>
-----