Hallo, mich würde interessieren wie man Formularfelder am besten in CSS macht (Rahmen,Schriftfarbe) hab jetzt überhaupt keinen Plan mehr, ob dass überhaupt noch aktuell ist und wie ich am besten eigentlich vorgehe und ob überhaupt der Aufbau richtig ist.
Hier mal mein Code:
simulation.html
HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
<head>
<title>
BHKWPartner - das optimale BHKW von Ihrem Installateur!
</title>
<link href="./design.css" type="text/css" rel="stylesheet" />
</head>
<body>
<div id="header">
</div>
<div id="left">
<ul id="navigation">
<li> <a href="index.html">Startseite</a> </li>
<li> <a href="simulation.html">Simulationsanfrage </a> </li>
<li> <a href="planung.html">BHKW-Planung </a> </li>
<li> <a href="abrechnung.html">BHKW-Abrechnung </a> </li>
<li> <a href="aktuelles.html">Aktuelles </a> </li>
<li> <a href="info.html">Info </a> </li>
<li> <a href="agb.html"> AGB </a> </li>
<li> <a href="impressum"> Impressum </a> </li>
</ul>
<div id="linksunten5">
<p>
<a href="http://jigsaw.w3.org/css-validator/check/referer">
<img style="border:0;width:88px;height:31px;padding-top:40%;padding-left:25%;"
src="http://jigsaw.w3.org/css-validator/images/vcss"
alt="CSS ist valide!" />
</a>
</p> </div>
</div>
<div id="Inhalt">
<br />
<form action="simulation.html">
<p>
<select name="1" class="1" size="5">
<option>Wohnhaus</option>
<option>Gewerbe(Bäcker,Metzger etc.)</option>
<option>Gebäude m. hohem Wärmeberarf (Hotel, Altenheim, Schwimmbad)</option>
<option>Gebäude mit geringer Nutzung (Verwaltung, Turnhalle, KiGa, Schule)</option>
<option>Sonstiges</option>
</select>
</p>
</form>
</div>
<div id="fusszeile">
<p>© Otto Huml Wärme und Strom</p>
</div>
</body>
</html>
Alles anzeigen
CSS Datei:
Code
* {
margin:0;
padding:0;
border:0;
list-style:none;
text-decoration:none;
font-family: Arial, Helvetica, sans-serif;
}
div#header {
background:url(images/header.gif);
visibility: visible;
height:110px;
padding-left: 100px;
background-repeat:no-repeat;
}
#left {
float: left;
clear: left;
width: 18%;
}
#inhalt {
color: black;
font-size: 11pt;
float: right;
width: 80%;
}
p {
margin-bottom: 1em;
}
h4 {
line-height:1cm;
font-size:12pt;
font-style:italic;
}
.Rot {
color:red;
line-height:1cm;
}
#inhalt a {
color: blue;
margin-left: 2em;
}
#linksunten {
background:#FFA500;
visibility:visible;
height:190px;
width:181px;
}
#linksunten2 {
background:#FFA500;
visibility:visible;
height:1400px;
width:181px;
}
#linksunten3 {
background:#FFA500;
visibility:visible;
height:580px;
width:181px;
}
#linksunten4 {
background:#FFA500;
visibility:visible;
height:1130px;
width:181px;
}
#linksunten5 {
background:#FFA500;
visibility:visible;
height:600px;
width:181px;
}
#linksunten6 {
background:#FFA500;
visibility:visible;
height:100px;
width:181px;
}
.Orange {
color:#FFA500;
}
.1 {
background:red;
}
ul#navigation a{
display: block;
border: 1px outset #FFA500;
background: #616161;
padding: 10px;
color: #FFFFFF;
font-weight: bold;
border-style: outset;
}
ul#navigation a:hover {
display: block;
border: 1px outset #FFA500;
background: #FFA500;
color: #FFFFFF;
border-style: outset;
}
div#fusszeile {
background: #FFA500;
height: 129px;
text-align: center;
line-height:3cm;
clear:both;
}
Alles anzeigen
PS: Alle zwei Dateien sind Valide.