| Autor |
Nachricht |
tomaszzZ
Threadersteller
Dabei seit: 22.05.2012
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Di 22.05.2012 19:13
Titel Schattenverlauf in HTML |
  |
|
Hey Leute,
ich habe folgendes Webdesign entworfen und bereits gesliced, mit Tabellen und iFrames die Seite erstellt. Die Seite besteht quasi nur aus Bildern. Das ganze ist ja relativ unsauber und aus SEO Sicht völlig daneben deswegen will ich das ordentlich mit div layern und CSS machen. Ich denke ich bekomm das auch hin, nur wüsste ich nicht wie ich den zwei farbigen Schatten unter den Boxen einbinden kann und ob dies überhaupt möglich ist. Wäre für einen kleinen Tipp sehr dankbar.
Uploaded with ImageShack.us
Zuletzt bearbeitet von tomaszzZ am Di 22.05.2012 19:14, insgesamt 1-mal bearbeitet
|
|
| |
  |
 |
snuwie
Dabei seit: 06.07.2010
Ort: -
Alter: -
Geschlecht: 
|
Verfasst Di 22.05.2012 22:09
Titel
|
|
|
|
Meinst du einen Schatten für die grünen Boxen oder den im Hintergrund?
|
|
| |
|
|
|
Anzeige
|
|
|
tomaszzZ
Threadersteller
Dabei seit: 22.05.2012
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Mi 23.05.2012 07:51
Titel
|
|
|
Der Schatten für die Boxen ja 
|
|
| |
|
|
snuwie
Dabei seit: 06.07.2010
Ort: -
Alter: -
Geschlecht:
|
|
| |
|
|
RpGrafix
Dabei seit: 17.11.2008
Ort: -
Alter: -
Geschlecht:
|
Verfasst Mi 23.05.2012 09:05
Titel
|
|
|
So wie der Schatten auf deiner Vorlage aussieht kannst du das nicht mit CSS lösen.
In dem Fall als Bild abspeichern und integrieren - wirkt nicht unprofessionell und tut der SEO auch nicht weh 
|
|
| |
|
|
snuwie
Dabei seit: 06.07.2010
Ort: -
Alter: -
Geschlecht:
|
Verfasst Mi 23.05.2012 09:22
Titel
|
|
|
| RpGrafix hat geschrieben: | So wie der Schatten auf deiner Vorlage aussieht kannst du das nicht mit CSS lösen.
In dem Fall als Bild abspeichern und integrieren - wirkt nicht unprofessionell und tut der SEO auch nicht weh |
Den Hintergrund Schatten würde ich auch mit einem Bild lösen ...
|
|
| |
|
|
tomaszzZ
Threadersteller
Dabei seit: 22.05.2012
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Fr 25.05.2012 10:58
Titel
|
|
|
Ich weiß leider nicht genau wie ich das anstellen soll, dass der Schatten hinter den Boxen verlaufen soll. Ich weiß nur das absolute positionierte divs über relativ positionierte divs verlaufen können. Allerdings sind meine Boxen relativ positioniert. Muss ich die Boxen absolut positionieren und den Schatten relativ damit er hinter den Boxen verläuft oder gibt es noch einen anderen Trick?
Das ist meine erste Homepage. Mein Stylesheet ist etwas lang geraten. Ist das so in Ordnung oder sind dort Redundanzen drin?
| Code: | <!DOCTYPE html>
<head>
<meta name="description" content="Xbox 360 Flash und Reset Glitch Hack in Berlin" />
<meta name="keywords" content="flash, glitch, berlin, xbox, 360">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>360FlashBerlin.de</title>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="root_site">
<div id="head_main_container">
360FlashBerlin.de
</div>
<div id="navi_main_container">
<ul id="navigation_main">
<li><a href="index.html">Home</a></li>
<li><a href="tutorials.html">Tutorials</a></li>
<li><a href="kontakt.html">Kontakt</a></li>
</ul>
</div>
<div id="content_main_container">
<div id="content_left_main">
lorem impsum
</div>
<a href="glitch.html"><div id="content_right1_main">
Xbox Glitch
<span class="bottom">80€</span>
</div></a>
<a href="flash.html"><div id="content_right2_main">
Xbox Flash
<span class="bottom"><span class="small">ab </span>30€</span>
</div></a>
</div>
<div id="schatten">
<img src="images/schatten.png">
</div>
<div id="footer_main_container">
<ul id="navigation_footer">
<li><a href="agb.html">AGB</a></li>
<li><a href="impressum.html">Impressum</a></li>
</ul>
</div>
</div>
</html> |
| Code: | @charset "UTF-8";
/* CSS Document */
body
{
background: #dfdbdb;
text-align: center;
font-family:Georgia, "Times New Roman", Times, serif;
}
#root_site
{
width: 1000px;
height: 100%;
margin: 0 auto;
}
#head_main_container
{
width: 100%;
height: 130px;
color:#FFF;
text-align: right;
font-size:20px;
}
#navi_main_container
{
width: 100%;
height: 40px;
margin-bottom: 40px;
}
ul#navigation_main
{
margin: 0;
padding: 0;
text-align: center;
}
ul#navigation_main li
{
list-style:none;
display: inline;
margin: 0;
padding: 20px;
}
#navigation_main a
{
color:#FFF;
text-decoration:none;
font-size: 32px;
text-shadow:#999 10px 8px 20px;
}
#navigation_main a:hover
{
color:#666666;
text-decoration:none;
font-size: 32px;
text-shadow:#999 10px 8px 20px;
}
#content_main_container
{
background-color:#dfdbdb;
width: 700px;
height: 300px;
float: left;
margin-left: 150px;
}
#content_left_main
{
width: 490px;
height: 290px;
background-color: #00b633;
float:left;
text-align: left;
color:#FFFFFF;
margin-right: 10px;
padding: 5px;
}
#content_right1_main
{
position:relative;
width: 178px;
height: 133px;
float: right;
background-color:#00b633;
margin-bottom: 10px;
text-align: left;
color:#FFFFFF;
padding: 6px;
font-size: 24px;
}
#content_right2_main
{
position:relative;
width: 178px;
height: 133px;
background-color: #00b633;
float: right;
text-align: left;
color:#FFFFFF;
padding: 6px;
font-size: 24px;
}
#content_main_container a
{
text-decoration: none;
color:#F0F;
}
#content_main_container a:hover
{
text-decoration:none;
}
.bottom
{
font-size: 32px;
position: absolute;
bottom: 6px;
right: 8px;
}
.small
{
font-size:22px;
}
.small_text
{
font-size:12px;
}
#schatten
{
}
#footer_main_container
{
background-color:#dfdbdb;
width: 100%;
height: 20px;
float:left;
margin-top: 20px;
}
ul#navigation_footer
{
margin: 0;
padding: 0;
text-align: center;
}
ul#navigation_footer li
{
list-style:none;
display: inline;
margin: 0;
padding: 8px;
}
#navigation_footer a
{
color:#FFF;
text-decoration:none;
font-size: 14px;
}
#navigation_footer a:hover
{
color:#666666;
text-decoration:none;
font-size: 14px;
}
|
|
|
| |
|
|
snuwie
Dabei seit: 06.07.2010
Ort: -
Alter: -
Geschlecht:
|
Verfasst Fr 25.05.2012 11:08
Titel
|
|
|
|
wie wäre es als hintergrund bild für den <body>?
|
|
| |
|
|
| |
|
|
| Ähnliche Themen |
HTML/CSS Problem mit <html><body> komischer Abstand unten
Anzeige in HTML aber ohne html ;-)
Externe HTML in HTML einbinden
html css
html und osX
psd into html?
|
|
Willkommen auf dem Portal für Mediengestalter
