CSS综合案例left部分

  1 /*全局样式*/
  2 body,ul,li,span,a,img,h1,p{
  3     margin:0;
  4     padding:0;
  5 }
  6 body{
  7     background: url(../img/bg-body.gif) repeat-x #F1F1F1;
  8     font-size: 13px;
  9 }
 10 .floatL{
 11     float: left;
 12 }
 13 .floatR{
 14     float: right;
 15 }
 16 ul li{
 17     list-style: none;
 18 }
 19 .clear{
 20     overflow: hidden;
 21 }
 22 /*box层样式*/
 23 .box{
 24     width:973px;
 25     margin:0 auto;
 26 }
 27 /*top层样式*/
 28 .box .header .top{
 29     height: 27px;
 30     line-height: 27px;
 31 }
 32 .box .header .top{
 33     color:#0174C7;
 34 }
 35 .box .header .top a{
 36     color:#515151;
 37     padding:0 8px;
 38     border-right:1px dotted #444;
 39 }
 40 .box .header .top a:hover{
 41     color: #f00;
 42 }
 43 .box .header .top .blue{
 44     color:#00f;
 45 }
 46 .box .header .top .red{
 47     color:#f00;
 48 }
 49 .noline{
 50     border-right: none !important;
 51 }
 52 /*logo层样式*/
 53 .box .logo{
 54     height: 122px;
 55     background: url(../img/bg-logo.jpg) no-repeat right bottom;
 56 }
 57 .box .logo .logoC{
 58     padding-top:20px;
 59 }
 60 .box .logo .logoC h1{
 61     padding-top:10px;
 62     padding-bottom: 10px;
 63     color:#0473C4;
 64 }
 65 .box .logo .logoC ul li{
 66     width:68px;
 67     height: 20px;
 68     line-height: 20px;
 69     background-image: url(../img/li01.png);
 70     color: #fff;
 71     margin-right:10px;
 72     padding-left: 10px;
 73 }
 74 .box .logo .logoL{
 75     padding:23px 10px;
 76     
 77 }
 78 .box .logo .logoR{
 79     padding-top:20px;
 80 }
 81 /*nav导航栏样式*/
 82 .box .nav{
 83     height: 47px;
 84     line-height: 47px;
 85 }
 86 .box .nav ul li{
 87     padding-left: ;
 88     text-align: center;
 89 }
 90 .box .nav a{
 91     margin-right: 6px ;
 92     display: block;
 93     width: 73px;
 94     height: 47px;
 95     font-weight: bold;
 96     color: #fff;
 97 }
 98 .box .nav .a2 {
 99     width: 85px;
100 }
101 .box .nav .a1{
102     background: url(../img/menu2.gif);
103 }
104 .box .nav a:hover{
105     background: url(../img/menu2.gif);
106 }
107 .box .nav .a2:hover{
108     background: url(../img/menu1.gif);
109 }
110 /*left层样式*/
111 .box .left{
112     width: 660px;
113     padding:0px 10px;
114 }
115 .box .left .kaixuela{
116     background-color:#FFFFFF ;
117     margin-bottom: 10px;
118 }
119 .box .left .kaixue{
120     height: 36px;
121     line-height: 36px;
122     border-bottom: 1px solid #E0E0E0;
123     background: url(../img/jiantou.jpg) no-repeat right;
124     padding-bottom: 10px;
125     color:#5B5B5B;
126 }
127 .box .left .kaixuela span{
128     font-size: 24px;
129     color:#0174C9;
130     font-weight: bold;
131 }
132 .box .left .leftL{
133     width:300px;
134     padding:10px 0;
135 }
136 .box .left .leftR{
137     width:330px;
138     padding:10px 0;
139 }
140 .box .left .leftR ul li img{
141     width:142px;
142     height:88px;
143 }
144 .box .left .leftR ul li{
145     float: left;
146     padding-left: 20px;
147 }
148  /*学院信息*/
149 .box .left .college{
150     width:650px;
151     background-color:#FFFFFF ;
152     margin-bottom: 10px;
153     padding-left: 10px;
154 }
155 .box .left .college .college-center ul li{
156     width:305px;
157     background: url(../img/li01.jpg) no-repeat left center;
158     padding:5px 10px;
159     float:left;
160 }
161 .box .left .college .college-center ul li .red{
162     color: #f00;
163 }
164 .box .left .college .college-center ul li .blue{
165     color: #00f;
166 }
167 .box .left .college .college-bottom{
168     float: right;
169 }
170 /*校园动态*/
171 .box .left .dongtai{
172      background: url(../img/more01.gif)no-repeat right bottom;
173      width:660px;
174      padding-bottom: 20px;
175      background-color:#FFFFFF ;
176      margin-bottom: 10px;
177 }
178 .box .left .dongtai .dongtai-top{
179     padding-bottom: 10px;
180     padding-top: 10px;
181     margin-bottom: 15px;
182     border-bottom: 1px solid #CCCCCC;
183 }
184 .box .left .dongtai  span{
185     font-size:24px;
186     color:#0174C9;
187 }
188 .box .left .dongtai .black{
189     color:#000000;
190 }
191 .box .left .dongtai .dongtai-top img{
192     float:right;
193     padding-right:5px;
194 }
195 .box .left .dongtai .dongtai-left{
196     width:300px;
197     padding-left: 10px;
198 }
199 .box .left .dongtai .dongtai-left a{
200     display: block;
201     text-align: center;
202 }
203 .box .left .dongtai .dongtai-right{
204     padding-right: 50px;
205 }
206 .box .left .dongtai .dongtai-right p{
207     font-size:24px;
208     color:#80809F;
209 }
210 .box .left .dongtai .dongtai-right ul li{
211     padding:1px 10px 0px 5px;
212     line-height: 20px;
213     background:url(../img/li04.jpg) no-repeat left center;
214 }
215 /*论坛热帖层样式*/
216 .box .left .retie{
217      background-color:#FFFFFF ;
218      padding: 10px;
219 }
220 .box .left .retie .title{
221     width: 650px;
222     height:34px;
223     line-height: 34px;
224     background: url(../img/bg01.gif) no-repeat;
225     margin-left: 10px;
226     padding-right: 10px;
227 }
228 .box .left .retie .content{
229     padding-top: 10px;
230 }
231 .box .left .retie .title span{
232     font-size:18px;
233     font-family: Arial;
234     margin-left: 10px;
235     margin-right: 10px;
236 }
237 .box .left .retie .title .blue{
238     color:#0174C9;
239 } 
240 .box .left .retie .title .floatR{
241     font-size: 14px;
242 }
243 .box .left .retie .content li{
244     width:300px;
245     background: url(../img/li05.gif) no-repeat left center;
246     padding-left: 20px;
247     float: left;
248     padding-top: 5px;
249 }
250 .box .left 
251 /*right层样式*/
252 .box .right{
253     width:300px;
254     border: 1px solid #000;
255 }
256 /*超链接样式*/
257 a:link,a:visited{
258     text-decoration: none;
259     color: #444;
260     }
261 a:hover{
262     color: #f00;
263     }