Suche im Forum:
Suchen


Autor Nachricht
Beitrag27.08.2008 um 14:09 (UTC)    
Titel: css code einfügen

Liebe Leser,
ich habe mir ein design von freecsstemplates.org runtergeladen, aber ich kann es nicht einfügen! es wäre toll, wenn ihr mir helfen könntet:

Der csscode lautet:
/*
Design by Free CSS Templates
http://www.freecsstemplates.org
Released for free under a Creative Commons Attribution 2.5 License
*/

* {
margin: 0;
padding: 0;
}

body {
background: #FFFFFF url(images/img01.jpg) repeat-x;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 13px;
color: #7F7772;
}

h1, h2, h3 {
margin-bottom: 15px;
font-family: Georgia, "Times New Roman", Times, serif;
font-weight: normal;
color: #333333;
}

h1 {
font-size: 197%;
}

h2 {
font-size: 152%;
}

h3 {
font-size: 100%;
font-weight: bold;
}

p, ul, ol {
margin-bottom: 15px;
line-height: 1.6em;
}

ul, ol {
margin-left: 2em;
}

blockquote {
margin-left: 1em;
padding-left: 1em;
background: url(images/img09.gif) repeat-y;
font-style: italic;
}

a:link {
color: #0AAAFD;
}

a:hover, a:active {
text-decoration: none;
color: #FF6700;
}

a:visited {
color: #7F7772;
}

img {
border: none;
}

img.left {
float: left;
margin: 0 20px 0 0;
}

img.right {
float: right;
margin: 0 0 0 20px;
}

/* Menu */

#menu {
width: 770px;
height: 105px;
margin: 0 auto;
}

#menu ul {
margin: 0;
padding: 0;
list-style: none;
}

#menu li {
display: block;
float: left;
width: 122px;
height: 65px;
padding: 40px 0 0 0;
}

#menu a {
display: block;
width: 122px;
height: 32px;
padding: 13px 0 0 0;
background: url(images/img02.jpg) no-repeat;
text-align: center;
text-transform: uppercase;
text-decoration: none;
font-weight: bold;
color: #FFFFFF;
}

#menu a:hover {
background-image: url(images/img03.jpg);
}

#menu .active {
padding-top: 35px;
}

#menu .active a {
height: 37px;
padding-top: 16px;
background-image: url(images/img04.jpg);
color: #327EBE;
}

#menu .active a:hover {
background-image: url(images/img04.jpg);
}

/* Header */

#header {
width: 770px;
height: 160px;
margin: 0 auto;
}

/* Logo */

#logo {
float: left;
width: 250px;
height: 160px;
background: url(images/img05.jpg) no-repeat;
}

#logo h1, #logo h2 {
text-align: center;
}

#logo h1 {
padding-top: 90px;
background: url(images/img07.jpg) no-repeat center center;
letter-spacing: 8px;
font-size: 197%;
}

#logo h2 {
letter-spacing: 2px;
font-size: 85%;
}

#logo a {
text-transform: uppercase;
text-decoration: none;
color: #FFFFFF;
}

/* Banner */

#banner {
float: right;
width: 520px;
height: 160px;
background: url(images/img06.jpg) no-repeat;
}

#banner a {
float: right;
padding: 120px 20px 0 0;
text-decoration: none;
text-align: right;
font-size: 136%;
font-style: italic;
color: #FFFFFF;
}

/* Page */

#page {
width: 760px;
margin: 0 auto;
padding: 20px 0 0 0;
}

/* Content */

#content {
float: right;
width: 510px;
}

.post {
margin-bottom: 20px;
}

.post .title {
padding: 0 20px;
}

.post .story {
padding: 0 20px;
}

.post .meta {
padding: 5px 20px;
background: url(images/img09.gif) repeat-x;
}

.post .meta p {
margin: 0;
font-size: 77%;
}

.boxed .title {
height: 32px;
margin: 0;
padding: 8px 0 0 20px;
background: url(images/img08.jpg) no-repeat;
letter-spacing: -1px;
color: #FF3300;
}

.boxed .story {
padding: 20px;
border: 1px solid #FF8D17;
}

.boxed .meta {
padding: 5px 10px;
background: #FF8D17;
color: #FFFFFF;
}

.boxed .meta a {
color: #FFFFFF;
}

/* Sidebar */

#sidebar {
float: left;
width: 240px;
}

#sidebar ul {
margin: 0;
padding: 0;
list-style: none;
}

#sidebar li {
margin-bottom: 15px;
}

#sidebar li ul {
padding: 10px;
border: 1px solid #0AAAFD;
border-top: none;
}

#sidebar li li {
margin: 0;
padding: 3px 0;
background: url(images/img09.gif) repeat-x;
}

#sidebar li li.first {
background: none;
}

#sidebar li h2 {
height: 30px;
margin: 0;
padding: 10px 0 0 15px;
background: url(images/img10.jpg) no-repeat;
letter-spacing: -1px;
color: #327EBE;
}

#sidebar a:link {
text-decoration: none;
}

#sidebar a:hover {
text-decoration: underline;
}

#sidebar li a {
padding-left: 10px;
background: url(images/img11.gif) no-repeat left center;
}

/* Footer */

#footer {
clear: both;
height: 100px;
padding: 15px 0;
background: #D1D1D1;
border-top: 5px solid #999999;
text-align: center;
}

#footer p {
margin: 0;
color: #999999;
}

#footer a {
color: #999999;
}

#footer a:hover {
color: #FFFFFF;
}


danke im vorraus
mfg http://www.all4homepages.de.tl/
Code:

<a href="http://all4homepages.de.tl/"><img width="586" height="75" border="0" alt="HpHilfe.de" src="http://www.hphilfe.de/bannergen.php?text=Homepage Tools ::: Designs&text2=
all4homepages.de.tl&bild=bannergenerator/4.jpg" /></a>
Beitrag27.08.2008 um 14:16 (UTC)    
Titel:

1. den Code musst du hier einfügen:
Arrow Design einstellen
Arrow "CSS-Allgemein" als Design auswählen
Arrow Erweiterte Einstellungen
Arrow Text über dem Design

2. Du musst noch die ganzen Bilder aus dem Design hochladen.
z.B.
Zitat:
blockquote {
margin-left: 1em;
padding-left: 1em;
background: url(images/img09.gif) repeat-y;
font-style: italic;
}
In das rote gehört das Bild, dass im Ordner unter dem Namen "images/img09" liegt.

mfg
______________
Besucht die offizielle Hilfeseite vom Homepage-Baukasten:

Iceblue Generator | Red Generator | Butterfly Generator
Beitrag27.08.2008 um 15:12 (UTC)    
Titel:

Damit der Browser weiß welche CSS-Codes zu welchem Teil deines HTML-Codes musst du deinen HTML-Code-Teilen eine ID (wenn es nur ein einziges Element,z.B. ein Link ist) oder eine Klasse (falls du alle Links verändern möchtest) zuweisen. Diese IDs und Classes sind einfach nur willkührliche, aber eindeutige Wörter, die jeder Programmierer oder Designer nach eigenem Geschmack wählen kann. Aus diesem Grund kannst du nicht einfach den Code eines Templates benutzen, wenn du nicht den dazu passenden HTML-Code hast.
Beiträge der letzten Zeit anzeigen:   


Powered by phpBB © 2001, 2005 phpBB Group
Deutsche Übersetzung von phpBB.de