Honlapkészítés Egyeteme/3.rész - Stíluslapok/CSS stlye throughout
Megjelenés
(Honlapkészítés Egyeteme 3.rész - Stíluslapok/CSS stlye throughout szócikkből átirányítva)
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 }