Antworten auf deine Fragen:
Neues Thema erstellen

Probleme mit Schalgschatten und round Corners

wotan100

Noch nicht viel geschrieben

Hallo, ich bins mal wieder!
Also ich hab ein tutorial gefunden, hier der link:

ist sicher auch für viele andere ineressant!

Aber bei mir wirds nicht angezeigt!
Benutze FF 5.0.....

Ich glaub nit dass ich was falsch abgeschrieben hab! *g
Bitte um Hilfe!
Hier der Code:
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
#container{
    width:300px;
    height:400px;
    margin: 0 auto;
    position:relative;
    background:#0F0;

}
#container.meine_box {

/* Für die Webkitbrowser */
-webkit-border-radius: 5px;

/* Für die Geckobrowser */
-moz-border-radius: 5px;

/* Für die KHTML-Browser */
-khtml-border-radius: 5px;

/* Die zukünftige CSS 3.0 Deklaration */
border-radius: 5px;

/* Und hier sind die Deklarationen für die Schatten.
Der erste PX-Wert steht für die Y-Achse, der zweite Wert für die X-Achse und der dritte Wert für die Weichzeichnung des Schattens. Und der letzte Wert ist die Schattenfarbe. */

-webkit-box-shadow: 5px 5px 10px #3C6;
-moz-box-shadow: 5px 5px 10px #CF3;
box-shadow: 5px 5px 10px #F36;
}
</style>
</head>

<body>
<div id="container">round_Corners_Schlagschatten

</div>
</body>
</html>

lg
 

simonpicos

Mod | Forum

AW: Probleme mit Schalgschatten und round Corners

Du hast die class einfach aus dem Tutorial übernommen. In deinem Fall müsstest du den Code mit dem Schatten und den runden Ecken einfach in deine CSSbeschreibung für #container setzen.

HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
#container{
    width:300px;
    height:400px;
    margin: 0 auto;
    position:relative;
    background:#0F0;
/* Für die Webkitbrowser */
-webkit-border-radius: 5px;

/* Für die Geckobrowser */
-moz-border-radius: 5px;

/* Für die KHTML-Browser */
-khtml-border-radius: 5px;

/* Die zukünftige CSS 3.0 Deklaration */
border-radius: 5px;

/* Und hier sind die Deklarationen für die Schatten.
Der erste PX-Wert steht für die Y-Achse, der zweite Wert für die X-Achse und der dritte Wert für die Weichzeichnung des Schattens. Und der letzte Wert ist die Schattenfarbe. */

-webkit-box-shadow: 5px 5px 10px #3C6;
-moz-box-shadow: 5px 5px 10px #CF3;
box-shadow: 5px 5px 10px #F36;
}

</style>
</head>

<body>
<div id="container">round_Corners_Schlagschatten

</div>
</body>
</html>
 
Zuletzt bearbeitet:
Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Antworten auf deine Fragen:
Neues Thema erstellen

Willkommen auf PSD-Tutorials.de

In unseren Foren vernetzt du dich mit anderen Personen, um dich rund um die Themen Fotografie, Grafik, Gestaltung, Bildbearbeitung und 3D auszutauschen. Außerdem schalten wir für dich regelmäßig kostenlose Inhalte frei. Liebe Grüße senden dir die PSD-Gründer Stefan und Matthias Petri aus Waren an der Müritz. Hier erfährst du mehr über uns.

Stefan und Matthias Petri von PSD-Tutorials.de

Nächster neuer Gratisinhalt

03
Stunden
:
:
25
Minuten
:
:
19
Sekunden

Flatrate für Tutorials, Assets, Vorlagen

Zurzeit aktive Besucher

Statistik des Forums

Themen
118.615
Beiträge
1.538.352
Mitglieder
67.527
Neuestes Mitglied
Christian Eidelloth
Oben