给博客设计的样式

连夜给微博设计了样式，没申请更改html，但是还想更改原本的布局，所以只能通过样式改，感觉好麻烦呀。

不过终于有博客啦！开心！

最后附上css代码，第一次写这么完整的一个网页样式，写的很乱，也算是对自己自学一个多月成果的验收..

  1 a,div,h1,h2,h3,h4,h5,h6,ul,li,tbody,tr,td,table,th,input,body{
  2      margin: 0;
  3      padding: 0;
  4      font-family: "微软雅黑";
  5     -webkit-user-select: none;
  6  }
  7 a{
  8     /*去掉下面的横杠*/
  9     text-decoration: none;
 10 }
 11 #header{
 12     background-image: url(http://images.cnblogs.com/cnblogs_com/1997ou/1061045/o_header.png);
 13     width: 825px;
 14     height: 160px;
 15     color: #4d4849;
 16     position: absolute;
 17 }
 18 #blogTitle{
 19     /*清除随子元素浮动*/
 20     overflow: hidden;
 21 }
 22 #blogTitle h1{
 23     display: none;
 24 }
 25 #blogTitle h2{
 26     margin-top: 50px;
 27 }
 28 #blogTitle h2{
 29     height: 40px;
 30     margin-left: 30px;
 31     font-size: 15px;
 32     font-weight: normal;
 33 }
 34 ul,li{
 35     list-style: none;
 36     display: inline-block;
 37 }
 38 #navigator{
 39     margin-top: 30px;
 40 }
 41 #navList{
 42     width: 550px;
 43     height: 26px;
 44     margin-left: 30px;
 45     border: 2px dashed #4d4849;
 46 }
 47 #navList li{
 48     width: 80px;
 49     height: 26px;
 50     text-align: center;
 51     float: left;
 52 }
 53 #navList li a{
 54     font-size: 18px;
 55     color: #4d4849;
 56 }
 57 #navList li a:hover{
 58     font-size: 20px;
 59     color: #468a44;
 60 }
 61 .blogStats{
 62     width: 200px;
 63     height: 30px;
 64     font-size: 12px;
 65     margin-left: 645px;
 66     margin-top: 2px;
 67 }
 68 #sideBar{
 69      width: 550px;
 70     margin-left: 800px;
 71     margin-top: 5px;
 72  }
 73 .CalDayHeader,#sideBar h3{
 74     color: #468a44;
 75 }
 76 .newsItem,#leftcontentcontainer{
 77     padding: 27px;
 78 }
 79 #main{
 80     margin-top: 5px;
 81     overflow: hidden;
 82 }
 83 #mainContent{
 84     position: absolute;
 85     top: 190px;
 86     width: 730px;
 87     margin-left: 30px;
 88     border: 2px dashed #4d4849;
 89     padding: 10px;
 90 }
 91 #footer{
 92      display: none;
 93  }
 94 #profile_block a{
 95     color: #4d4849;
 96 }
 97 #profile_block a:hover{
 98     color: #468a44;
 99 }
100 #blog-sidecolumn a{
101     color: #4d4849;
102 }
103 #blog-sidecolumn a:hover{
104     color: #468a44;
105 }
106 .day a{
107      color: #468a44;
108  }
109 .day a:hover{
110     /*加粗*/
111     font-weight: bold;
112  }
113 #cb_post_title_url{
114     color: #468a44;
115 }
116 .postDesc a{
117     color: #468a44;
118 }
119 #comment_nav a{
120     color: #468a44;
121 }
122 #commentbox_opt a{
123     color: #468a44;
124 }

 

posted @ 2017-08-18 03:52  欧学妹  阅读(190)  评论(0)    收藏  举报