Honlapkészítés Egyeteme/3.rész - Stíluslapok/CSS stlye throughout

A Wikikönyvekből, a szabad elektronikus könyvtárból.
Ugrás a navigációhoz Ugrás a kereséshez
freecsstemplates.org/preview/throughout 
DOWNLOAD
1  	 	 	 	 	 	 	
2 	/* 	
3 	Design by Free CSS Templates 	
4 	http://www.freecsstemplates.org 	
5 	Released for free under a Creative Commons Attribution 2.5 License
6 	*/ 	
7 	
8 	body { 	
9 		margin: 0px; 	
10 		padding: 0; 	
11 		background: #4C9BCD url(images/img01.jpg) repeat-x left top;
12 		font-family: Arial, Helvetica, sans-serif; 	
13 		font-size: 12px; 	
14 		color: #919191; 	
15 	} 	
16 	
17 	h1, h2, h3 { 	
18 		margin: 0; 	
19 		text-transform: uppercase; 	
20 		font-weight: normal; 	
21 		color: #549900; 	
22 	} 	
23 	
24 	h1 { font-size: 44px; } 	
25 	
26 	h2 { font-size: 18px; } 	
27 	
28 	h3 { } 	
29 	
30 	p, ul, ol { 	
31 		margin-top: 0; 	
32 		line-height: 240%; 	
33 		text-align: justify; 	
34 	} 	
35 	
36 	ul, ol { } 	
37 	
38 	blockquote { } 	
39 	
40 	a { color: #4999CB; } 	
41 	
42 	a:hover { text-decoration: none; } 	
43 	
44 	a img { 	
45 		border: none; 	
46 	} 	
47 	
48 	img.left { 	
49 		float: left; 	
50 		margin: 7px 30px 0 0; 	
51 	} 	
52 	
53 	img.right { 	
54 		float: right; 	
55 		margin: 7px 0 0 30px; 	
56 	} 	
57 	
58 	hr { display: none; } 	
59 	
60 	.list1 { 	
61 	} 	
62 	
63 	.list1 li { 	
64 		float: left; 	
65 		line-height: normal; 	
66 	} 	
67 	
68 	.list1 li img { 	
69 		margin: 0 30px 30px 0; 	
70 	} 	
71 	
72 	.list1 li.alt img { 	
73 		margin-right: 0; 	
74 	} 	
75 	
76 	#wrapper { 	
77 	} 	
78 	
79 	/* Header */ 	
80 	
81 	#header { 	
82 		width: 940px; 	
83 		height: 68px; 	
84 		margin: 0 auto; 	
85 		background: url(images/img02.jpg) no-repeat left top; 	
86 	} 	
87 	
88 	/* Menu */ 	
89 	
90 	#menu { 	
91 		float: left; 	
92 		width: 500px; 	
93 		height: 68px; 	
94 	} 	
95 	
96 	#menu ul { 	
97 		margin: 0; 	
98 		padding: 15px 0px 0px 5px; 	
99 		list-style: none; 	
100 		line-height: normal; 	
101 	} 	 
102 	
103 	#menu li { 	
104 		display: block; 	
105 		float: left; 	
106 	} 	
107 	
108 	#menu a { 	
109 		display: block; 	
110 		float: left; 	
111 		height: 32px; 	
112 		padding: 10px 20px 0px 20px; 	
113 		letter-spacing: -1px; 	
114 		text-decoration: none; 	
115 		text-align: center; 	
116 		text-transform: lowercase; 	
117 		font-family: Arial, Helvetica, sans-serif; 	
118 		font-size: 18px; 	
119 		font-weight: normal; 	
120 		color: #FFFFFF; 	
121 	} 	
122 	
123 	#menu a:hover {  	
124 		text-decoration: none;  	
125 	} 	
126 	
127 	#menu .current_page_item a { 	
128 	} 	
129 	
130 	#menu .first { 	
131 	} 	
132 	/* Search */ 	
133 	
134 	#search { 	
135 		float: right; 	
136 		padding: 10px 10px 0px 0px; 	
137 	} 	
138 	
139 	#search form { 	
140 		float: right; 	
141 		margin: 0; 	
142 		padding: 4px 0px 0 0; 	
143 	} 	
144 	
145 	#search fieldset { 	
146 		margin: 0; 	
147 		padding: 0; 	
148 		border: none; 	
149 	} 	
150 	
151 	#search input { 	
152 		float: left; 	
153 		font: 12px Arial, Helvetica, sans-serif; 	
154 	} 	
155 	
156 	#search-text { 	
157 		width: 170px; 	
158 		margin-top: 8px; 	
159 		margin-left: 60px; 	
160 		margin-right: 40px; 	
161 		padding: 6px 0 0 7px; 	
162 		border: none; 	
163 		background: none; 	
164 		font-family: Arial, Helvetica, sans-serif; 	
165 		color: #838383; 	
166 	} 	
167 	
168 	#search-submit { 	
169 		width: 82px; 	
170 		height: 28px; 	
171 		margin-left: 10px; 	
172 		padding: 0px 5px; 	
173 		background: url(images/img03.jpg) no-repeat left top; 	
174 		border: none; 	
175 		text-indent: -9999px; 	
176 		color: #FFFFFF; 	
177 	} 	
178 	
179 	/* Page */ 	
180 	
181 	#page { 	
182 		width: 880px; 	
183 		margin: 0px auto; 	
184 		padding: 40px 30px 0px 30px; 	
185 		background: #222222; 	
186 	} 	
187 	
188 	#page-bgtop { 	
189 	} 	
190 	
191 	
192 	/** LOGO */ 	
193 	
194 	#logo { 	
195 		width: 920px; 	
196 		height: 45px; 	
197 		margin: 0 auto; 	
198 		padding-top: 5px; 	
199 		padding-left: 20px; 	
200 	} 	
201 	
202 	#logo h1, #logo p { 	
203 		float: left; 	
204 		margin: 0px; 	
205 		line-height: normal; 	
206 		text-transform: lowercase; 	
207 		font-weight: normal; 	
208 		color: #FFFFFF; 	
209 	} 	
210 	
211 	#logo p { 	
212 		padding: 13px 0px 0px 5px; 	
213 		text-transform: lowercase; 	
214 		font-family: Georgia, "Times New Roman", Times, serif;
215 		font-size: 13px; 	
216 		color: #FFFFFF; 	
217 	} 	
218 	
219 	#logo h1 { 	
220 		letter-spacing: -1px; 	
221 		font-size: 30px; 	
222 	} 	
223 	
224 	#logo a { 	
225 		text-decoration: none; 	
226 		color: #FFFFFF; 	
227 	} 	
228 	
229 	#banner { 	
230 		padding-bottom: 20px; 	
231 	} 	
232 	
233 	/* Content */ 	
234 	
235 	#content { 	
236 		float: left; 	
237 		width: 600px; 	
238 	} 	
239 	
240 	/* Post */ 	
241 	
242 	.post { 	
243 		margin-bottom: 30px; 	
244 		padding-bottom: 20px; 	
245 		border-bottom: 1px dashed #1D1D1D; 	
246 		background: #1E1E1E; 	
247 	} 	
248 	
249 	.post .title { 	
250 		padding: 4px 20px 0px 20px; 	
251 		height: 44px; 	
252 		background: #161616; 	
253 	} 	
254 	
255 	.post .title a { 	
256 		text-decoration: none; 	
257 		text-transform: capitalize; 	
258 		font-size: 30px; 	
259 		color: #4999CB; 	
260 	} 	
261 	
262 	.post .date { 	
263 		display: inline-block; 	
264 		margin: 0px; 	
265 		padding: 0px 10px; 	
266 		color: #FFFFFF; 	
267 	} 	
268 	
269 	.post .meta { 	
270 		margin-left: 2px; 	
271 		padding: 10px 30px 0px 10px; 	
272 		font-family: Arial, Helvetica, sans-serif; 	
273 		font-weight: normal; 	
274 		font-size: 10px; 	
275 		color: #66665E; 	
276 	} 	
277 	
278 	.post .meta span { 	
279 		margin: 0px; 	
280 	} 	
281 	
282 	.post .meta a { 	
283 		padding: 8px 10px 5px 10px; 	
284 		text-decoration: none; 	
285 		color: #FFFFFF; 	
286 	} 	
287 	
288 	.post .entry { 	
289 		padding: 30px 20px 20px 20px; 	
290 	} 	
291 	
292 	.post .links { 	
293 		display: block; 	
294 		width: 120px; 	
295 		height: 25px; 	
296 		margin: 0px; 	
297 		padding: 10px 0px 0px 20px; 	
298 		background: #161616 url(images/img10.jpg) no-repeat right top;
299 		text-decoration: none; 	
300 		font-family: Arial, Helvetica, sans-serif; 	
301 		font-size: 11px; 	
302 		text-decoration: none; 	
303 		font-weight: bold; 	
304 		color: #FFFFFF; 	
305 	} 	
306 	
307 	.post .comments { 	
308 		display: block; 	
309 		width: 120px; 	
310 		height: 18px; 	
311 		margin: 0px;  	
312 		padding: 3px 0px 0px 40px; 	
313 		background: #90BF35; 	
314 		border: 1px dashed #1D1D1D; 	
315 		text-decoration: none; 	
316 		font-family: Arial, Helvetica, sans-serif; 	
317 		font-size: 11px; 	
318 		text-decoration: none; 	
319 		font-weight: bold; 	
320 		color: #FFFFFF; 	
321 	} 	
322 	
323 	/* Sidebar */ 	
324 	
325 	#sidebar { 	
326 		float: right; 	
327 		width: 240px; 	
328 		font-family: Arial, Helvetica, sans-serif; 	
329 		font-size: 12px; 	
330 	} 	
331 	
332 	#sidebar ul { 	
333 		margin: 0; 	
334 		padding: 0; 	
335 		list-style: none; 	
336 		line-height: normal; 	
337 	} 	
338 	
339 	#sidebar li { 	
340 		margin-bottom: 30px; 	
341 		padding: 0 0 10px 0px; 	
342 		background: #1E1E1E; 	
343 	} 	
344 	
345 	#sidebar li ul { 	
346 		margin: 0px 0px; 	
347 	} 	
348 	
349 	#sidebar li li { 	
350 		margin: 0px; 	
351 		padding: 8px 0px 8px 0px; 	
352 		border-bottom: 1px solid #222222; 	
353 	} 	
354 	
355 	#sidebar li li a { 	
356 		padding: 0px 20px; 	
357 		font-weight: normal; 	
358 	} 	
359 	
360 	#sidebar li li a:hover { 	
361 		color: #666666; 	
362 	} 	
363 	
364 	#sidebar p { 	
365 		margin: 0; 	
366 		padding: 0px 14px; 	
367 	} 	
368 	
369 	#sidebar h2 { 	
370 		height: 30px; 	
371 		margin: 0 0 10px 0px; 	
372 		padding: 6px 20px 2px 20px; 	
373 		background: #161616; 	
374 		text-transform: capitalize; 	
375 		font-size: 18px; 	
376 		font-weight: normal; 	
377 		color: #4999CB; 	
378 	} 	
379 	
380 	
381 	#sidebar p { 	
382 		line-height: 200%; 	
383 	} 	
384 	
385 	#sidebar a { 	
386 		text-align: left; 	
387 		text-decoration: none; 	
388 		font-weight: bold; 	
389 		color: #666666; 	
390 	} 	
391 	
392 	/* Calendar */ 	
393 	
394 	#calendar { 	
395 	} 	
396 	
397 	#calendar caption { 	
398 		padding-bottom: 5px; 	
399 		font-weight: bold; 	
400 	} 	
401 	
402 	#calendar table { 	
403 		width: 100%; 	
404 		border-collapse: collapse; 	
405 		border-bottom: 1px solid #24130F; 	
406 		border-left: 1px solid #24130F; 	
407 		border-right: 1px solid #24130F; 	
408 	} 	
409 	
410 	#calendar thead th { 	
411 		padding: 5px 0; 	
412 		text-align: center; 	
413 		border-top: 1px solid #24130F; 	
414 		border-left: 1px solid #24130F; 	
415 		background: #24130F; 	
416 	} 	
417 	
418 	#calendar tbody td { 	
419 		padding: 5px 0; 	
420 		text-align: center; 	
421 		border-top: 1px solid #24130F; 	
422 		border-left: 1px solid #24130F; 	
423 		border-bottom: 1px solid #24130F; 	
424 	} 	
425 	
426 	#calendar tfoot td { 	
427 		padding: 5px; 	
428 		border-left: 1px solid #24130F; 	
429 		border-bottom: 1px solid #24130F; 	
430 	} 	
431 	
432 	#calendar tfoot #next { 	
433 		border-top: 1px solid #24130F; 	
434 		text-align: right; 	
435 	} 	
436 	
437 	#calendar tfoot #prev { 	
438 		border-top: 1px solid #24130F; 	
439 	} 	
440 	
441 	#calendar .pad { 	
442 		border-bottom: 1px solid #24130F; 	
443 	} 	
444 	
445 	#calendar #today { 	
446 		background: #24130F; 	
447 	} 	
448 	
449 	/* Footer */ 	
450 	
451 	#footer { 	
452 		width: 940px; 	
453 		height: 120px; 	
454 		margin: 0 auto; 	
455 		padding: 0; 	
456 		background: url(images/img09.jpg) no-repeat left top; 	
457 	} 	
458 	
459 	#footer p { 	
460 		margin: 0; 	
461 		padding: 30px 0px 0px 30px; 	
462 		text-align: center; 	
463 		text-transform: uppercase; 	
464 		line-height: normal; 	
465 		font-size: 10px; 	
466 	} 	
467 	
468 	#footer a { 	
469 	}