需要有一定的 html+CSS+JS 知识*(还在学习中)。
1.整体(home)
1 body { 2 color: #000; 3 background-color: #e6e6e6; 4 font-family: "微软雅黑" , "PTSans" , "Arial" ,sans-serif; 5 font-size: 16px; 6 min-height: 101%; 7 } 8 9 #home { 10 margin: 0 auto; 11 width: 95%; 12 min-width: 950px; 13 background-color: #fff; 14 padding: 47px; //合适的宽度 15 margin: 0px; 16 box-shadow: 0 2px 6px rgba(100, 100, 100, 0.3); 17 }
2.头部(header)美化
1 #navigator { 2 font-size: 13px; 3 border-bottom: 1px solid #ff0000; //设置颜色 4 border-top: 1px solid #ff0000; 5 height: 50px; 6 clear: both; 7 margin-top: 25px; 8 } 9 10 /*标题 : 唯心不易 格式*/ 11 #blogTitle h1 { 12 font-size: 36px; 13 font-weight: bold; 14 line-height: 0.5em; 15 margin-top: 20px; 16 text-align: center; 17 } 18 #blogTitle h2 { 19 font-weight: normal; 20 font-size: 13px; 21 font-size: 0.928571429rem; 22 line-height: 1.846153846; 23 color: #757575; 24 float: none; 25 width: auto; 26 text-align: center; 27 padding-top: 10px; 28 }
3.侧边栏(sideBar)美化
1 #navigator { 2 font-size: 13px; 3 border-bottom: 1px solid #ff0000; //设置颜色 4 border-top: 1px solid #ff0000; 5 height: 50px; 6 clear: both; 7 margin-top: 25px; 8 } 9 10 /*标题 : 唯心不易 格式*/ 11 #blogTitle h1 { 12 font-size: 36px; 13 font-weight: bold; 14 line-height: 0.5em; 15 margin-top: 20px; 16 text-align: center; 17 } 18 #blogTitle h2 { 19 font-weight: normal; 20 font-size: 13px; 21 font-size: 0.928571429rem; 22 line-height: 1.846153846; 23 color: #757575; 24 float: none; 25 width: auto; 26 text-align: center; 27 padding-top: 10px; 28 }
4.文章
1 /*文章标题*/ 2 .postTitle a:link, .postTitle a:visited, .postTitle a:active { 3 color: #ff0000; 4 transition: all 0.4s linear 0s; 5 } 6 /*推荐*/ 7 #div_digg{ 8 position:fixed; 9 bottom:5px; 10 width:140px; 11 right:20px; 12 border:1px solid #6FA833; 13 padding:10px; 14 background-color:#fff; 15 border-radius:5px 5px 5px 5px !important; 16 } 17 /*阅读文章时标题*/ 18 #topics .postTitle { 19 border: 0px; 20 font-size: 250%; 21 font-weight: bold; 22 float: left; 23 line-height: 1.5; 24 width: 100%; 25 padding-left: 0px; 26 text-align: center; 27 }