C
Cueball
Guest
Hey Leute,
ich hoffe ihr könnt mir hier behilflich sein. Ich versuche das schon seit knapp einer Woche hinzubekommen, doch da ich wirklich ein totaler anfänger in sachen html und css bin wende ich mich jetzt an euch.
Also zum einen möchte ich eine dropdown navigation haben, doch alles was ich gegoogelt habe bringt mich nicht weiter bzw konnte es nicht umsetzen. Ich hoffe ihr könnt mir da weiter helfen.
Und die Textbox soll ohne Hintergrund farbe sein, denn sie soll über einem Hintergrundbild gelegt sein. Damit ich dort reinschreiben kann... sprich einen festen Text den man nur in der html datei ändern kann und nicht im webbrowser selber. Ich hoffe ihr versteht was ich meine.
Die Codes poste ich euch, anbei ist gesagt momentan ist es nur für Chrome angepasst mit den bildern. Es wird für IE/FF noch gemacht.
Ich bin für jeden Tipp und jeden Ratschlag dankbar.
HTML Code:
CSS Code:
ich hoffe ihr könnt mir hier behilflich sein. Ich versuche das schon seit knapp einer Woche hinzubekommen, doch da ich wirklich ein totaler anfänger in sachen html und css bin wende ich mich jetzt an euch.
Also zum einen möchte ich eine dropdown navigation haben, doch alles was ich gegoogelt habe bringt mich nicht weiter bzw konnte es nicht umsetzen. Ich hoffe ihr könnt mir da weiter helfen.
Und die Textbox soll ohne Hintergrund farbe sein, denn sie soll über einem Hintergrundbild gelegt sein. Damit ich dort reinschreiben kann... sprich einen festen Text den man nur in der html datei ändern kann und nicht im webbrowser selber. Ich hoffe ihr versteht was ich meine.
Die Codes poste ich euch, anbei ist gesagt momentan ist es nur für Chrome angepasst mit den bildern. Es wird für IE/FF noch gemacht.
Ich bin für jeden Tipp und jeden Ratschlag dankbar.
HTML Code:
HTML:
<?xml version="1.0" encoding="iso-8859-1"?>
<!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" xml:lang="de" lang="de">
<head>
<link rel="stylesheet" href="indexcss2 - kopie.css" type="text/css" media="all" />
<title>
</title>
</head>
<body><div class="body">
<div id="wrapper"><div id="navi">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">Gilde</a>
<ul id="subnav-2">
<li><a href="/tools/csstabs/2">People</a></li>
<li><a href="/tools/csstabs/2">Careers</a></li>
<li><a href="/tools/csstabs/2">Press</a></li>
</ul></li>
<li><a href="#">Bewerbung</a></li>
<li><a href="#">Forum</a></li>
<li><a href="#">Gästebuch</a></li>
</ul>
</div><!-- END #nav -->
</div><!-- END #wrapper -->
<div id="wrapcontent"><p>Das hier ist ein Text fenster. Wir wollen mal testen ob er das</p>
<p> ENTER auch erkennt und mit übernimmt in die breite der bestimmung P!!!</p>
gojaofkjalfkalfkapf
akpfkapfalöds
löadlöda
lökaslda
</div><!-- END #wrapcontent -->
</div><!-- END #body -->
</body>
</html>CSS Code:
Code:
/* CSS Document */
html {height: 100.1%;}
* {
margin: 0;
padding: 0;
}
body {
font-family: Verdana, sans-serif;
line-height: 1.8em;
background: #000000 url(images/Diabolicabanner.jpg);
background-repeat: no-repeat;
background-position: top center;
background-size:650px auto;
-webkit-background-size: 1090px auto;
}
div#wrapper {
width: 1060px;
padding: 167px 700px 0px;
}
div#navi
{
font-size: 0.9em;
font-weight: bold;
padding: 40px 0px;
}
div#navi ul
{
list-style-type: none;
}
div#navi li
{
float: left;
margin-left: 5px;
}
div#navi a
{
display: block;
padding: 5px;
width: 130px;
height: 50px;
background-image: url(images/button2.png);
background-size:650px auto;
-webkit-background-size: 140px auto;
color: #68228B;
text-decoration: none;
text-align:center;
vertical-align:middle;
display:table-cell;
}
div#navi a:visited
{
color: #F00;
}
div#navi a:hover
{
color: #8B0000;
background-image: url(images/button);
}
div#navi #subnav-1:hover,
div#navi #subnav-2:hover,
div#navi #subnav-3:hover,
div#navi #subnav-4:hover {
display : inline;
width: 90%;
}
div#wrapcontent {background: url(images/umrandungmitpapier2.png);
width:auto;height:auto;
background-position:center;
background-repeat: no-repeat;
padding: 399px 50px;
background-size:auto 600px;
-webkit-background-size: auto 820px;
text-align:center;
tex
}
p {
color: #FF0000;
background-color: transparent;
width: 50%; height:0%;
padding-left: 470px;
text-align:left;
}
Zuletzt bearbeitet von einem Moderator:
