✔ Farbe des input textfeldes ändern

Status
Nicht offen für weitere Antworten.
C

cyberoner

Mitglied
Hi,

folgendes Problem: Habe ein Kontaktformular wo ich ahlt Name, Adresse usw eingeben muß.

Dann steht ja auf der einen seite der Name und auf der anderen Seite das leere weiße Textfeld.
Wie bekomme ich es hin das eben dieses weiße Textfeld nicht weiß sondern grau ist?

<td height="28" colspan="2" align="right" valign="top"><div align="center"><font color="#FFFFFF" face="Arial,helvetica" size="-1">Name
:</font></div></td>
<td width="234" valign="top"> <input type="text" name="name" value size="35"></td>
</tr>

Weil wenn ich das fettgedruckte ändere wird ja nur das Wort "Name" in eine andere Farbe gebracht und nicht das Eingabetextfeld selber
 
Das wird mit CSS geregelt:

Code: 
input.text 
{
background: #dfdfdf;
color: #2f2f2f;
}
HTML: 
<input type="text" class="text" name="name" value size="35">
 
hmm habe schon css für die Positionierung des Hintergrundbildes genommen. Kann ich da jetzt einfach ein zweites css nur für die Boxen einfügen?
 
HTML: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>GS Studio Montagen GmbH & Co KG</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
BODY {
	background-attachment: fixed;
	background-image:   url(Bilder/hintergrund1024.jpg);
	background-position: center center;
	background-repeat: no-repeat;
	height: 100%;
	width: 100%;
	visibility: visible;
	position: static;
	z-index: 1;
	right: 100%;
	left: 100%;
	overflow: auto;
	top: auto;
	bottom: auto;
	scroll: auto;
}
-->
</style>
</head>
<body bgcolor="#000000">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
  <!--DWLayoutTable-->
  <tr> 
    <td height="133" colspan="3" valign="top"><!--DWLayoutEmptyCell-->&nbsp;</td>
    <td width="100%" valign="top"> <div align="center"> 
        <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="456" height="114">
          <param name="movie" value="Bilder/oben.swf">
          <param name="quality" value="high">
          <param name="LOOP" value="false">
          <param name="wmode" value="transparent">
          <embed src="Bilder/oben.swf" width="456" height="114" loop="false" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" wmode="transparent"></embed></object>
      </div></td>
    <td colspan="3" valign="top"> <div align="right"><img src="file:///C|/Dokumente%20und%20Einstellungen/Jens/Eigene%20Dateien/Homepage/testbild/logo_test.jpg" width="150" height="124"> 
      </div></td>
    <td width="1">&nbsp;</td>
  </tr>
  <tr> 
    <td width="22" height="97">&nbsp;</td>
    <td width="173">&nbsp;</td>
    <td colspan="5" rowspan="12" valign="top"><div align="center"> <form action="http://www.onlyfree.de/generator/kontakt/formmail.php" method="POST" name="MyForm1">
        <input type="hidden" name="redirect" value="http://www.onlyfree.de/generator/kontakt/danke.htm">
        <input type="hidden" name="typemail" value="html">
        <input type="hidden" name="crypt" value="0"
>
        <input type="hidden" name="einleittext" value="">
        <input type="hidden" name="admin1" value="">
        <input type="hidden" name="admin2" value="">
        <input type="hidden" name="subject" value="Kontaktformular">
        <input type="hidden" name="admin" value="schulzke@gs-montage.de">
        <div align="center"> 
          <table width="510" border="0" cellpadding="3" cellspacing="2">
            <!--DWLayoutTable-->
            <tr> 
              <td height="27" colspan="3" valign="top"><div align="center"><font color="#FFFFFF" size="-1" face="Arial,helvetica"><strong>Mit 
                  diesem Fomular können Sie mit uns Kontakt aufnehmen.</strong></font><strong><font face="Arial,helvetica" size="-1"> 
                  </font></strong></div></td>
            </tr>
            <tr> 
              <td height="28" colspan="2" align="right" valign="top"><div align="center"><font color="#FFFFFF" face="Arial,helvetica" size="-1">Name 
                  :</font></div></td>
              <td width="234" valign="top"> <input type="text" name="name" value size="35"></td>
            </tr>
            <tr> 
              <td height="28" colspan="2" align="right" valign="top"><div align="center"><font color="#000000" face="Arial,helvetica" size="-1">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<font color="#FFFFFF"> 
                  Ihre Emailadresse:</font></font></div></td>
              <td valign="top"> <input type="text" name="email" value size="35"></td>
            </tr>
            <tr> 
              <td height="28" colspan="2" align="right" valign="top"><div align="center"><font color="#FFFFFF" face="Arial,helvetica" size="-1">Straße:</font></div></td>
              <td valign="top"> <input type="text" name="strasse" value size="35"></td>
            </tr>
            <tr> 
              <td height="28" colspan="2" valign="top"><div align="center"><font color="#FFFFFF" size="-1" face="Arial, Helvetica, sans-serif">PLZ</font><font color="#FFFFFF" size="-1">:</font></div></td>
              <td valign="top"><input type="text" name="strasse2" value size="35"></td>
            </tr>
            <tr> 
              <td height="28" colspan="2" align="right" valign="top"><div align="center"><font color="#FFFFFF" face="Arial,helvetica" size="-1">Ort:</font></div></td>
              <td valign="top"> <input type="text" name="ort" value size="35"></td>
            </tr>
            <tr> 
              <td height="28" colspan="2" align="right" valign="top"><div align="center"><font color="#FFFFFF" face="Arial,helveA?/?U?tica" size="-1">Land:</font></div></td>
              <td valign="top"> <input type="text" name="land" value size="35"></td>
            </tr>
            <tr> 
              <td height="28" colspan="2" align="right" valign="top"><div align="center"><font color="#FFFFFF" face="Arial,helvetica" size="-1">Telefon-Nummer:</font></div></td>
              <td valign="top"> <input type="text" name="tel" value size="35"></td>
            </tr>
            <tr> 
              <td height="28" colspan="2" align="right" valign="top"><div align="center"><font color="#FFFFFF" face="Arial,helvetica" size="-1">Fax-Nummer:</font></div></td>
              <td valign="top"> <input type="text" name="fax" value size="35"></td>
            </tr>
            <tr> 
              <td height="28" colspan="2" align="right" valign="top"> <div align="center"><font color="#FFFFFF" face="Arial,helvetica" size="-1">Sie 
                  sind:</font><font color="#000000" face="Arial,helvetica" size="-1"> 
                  &nbsp;</font></div></td>
              <td valign="top"> <select name="select" size="1">
                  <option selected>Endkunde</option>
                  <option>Hersteller</option>
                  <option>Firmenkunde</option>
                </select></td>
            </tr>
            <tr> 
              <td height="28" colspan="2" align="right" valign="top"> <div align="center"><font color="#FFFFFF" face="Arial,helvetica" size="-1">Ihre 
                  Art der Anfrage:&nbsp;</font></div></td>
              <td valign="top"> <select name="select2">
                  <option selected>Studiobau</option>
                  <option>K&uuml;chenmontage</option>
                  <option>M&ouml;belmontage</option>
                </select></td>
            </tr>
            <tr> 
              <td width="155" height="188" align="right" valign="top"><strong><font color="#000000"><br>
                </font><font color="#FFFFFF" face="Arial,helvetica" size="-1">Kommentar:</font></strong></td>
              <td colspan="2" valign="top"> <textarea cols="50" rows="10" name="comment"></textarea></td>
            </tr>
            <tr> 
              <td height="30" colspan="3" valign="top"><div align="center"><font face="Arial,helvetica"> 
                  <input type="submit" name="next"
     value="Abschicken">
                  <input type="reset" name="next" value="Zurücksetzen">
                  </font></div></td>
            </tr>
            <tr> 
              <td height="12"></td>
              <td width="95"></td>
              <td></td>
            </tr>
          </table>
        </div>
      </form>
    <td></td>
  </tr>
  <tr> 
    <td height="26"></td>
    <td valign="top"><div align="center"> 
        <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0" width="105" height="21">
          <param name="BASE" value=".">
          <param name="BGCOLOR" value="">
          <param name="movie" value="ueberuns.swf">
          <param name="quality" value="high">
          <param name="wmode" value="transparent">
          <embed src="ueberuns.swf" width="105" height="21" quality="high" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" wmode="transparent" base="." ></embed> 
        </object>
      </div></td>
    <td>&nbsp;</td>
  </tr>
  <tr> 
    <td height="26"></td>
    <td valign="top"><!--DWLayoutEmptyCell-->&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr> 
    <td height="1"></td>
    <td></td>
    <td></td>
  </tr>
  <tr> 
    <td height="25"></td>
    <td valign="top"><div align="center"> 
        <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0" width="100" height="22">
          <param name="BASE" value=".">
          <param name="BGCOLOR" value="">
          <param name="movie" value="referenz.swf">
          <param name="quality" value="high">
          <param name="wmode" value="transparent">
          <embed src="referenz.swf" width="100" height="22" quality="high" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" wmode="transparent" base="." ></embed> 
        </object>
      </div></td>
    <td>&nbsp;</td>
  </tr>
  <tr> 
    <td height="26"></td>
    <td valign="top"><!--DWLayoutEmptyCell-->&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr> 
    <td height="25"></td>
    <td valign="top"><div align="center"> 
        <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0" width="100" height="22">
          <param name="BASE" value=".">
          <param name="BGCOLOR" value="">
          <param name="movie" value="bild.swf">
          <param name="quality" value="high">
          <param name="wmode" value="transparent">
          <embed src="bild.swf" width="100" height="22" quality="high" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" wmode="transparent" base="." ></embed> 
        </object>
      </div></td>
    <td>&nbsp;</td>
  </tr>
  <tr> 
    <td height="26"></td>
    <td valign="top"><!--DWLayoutEmptyCell-->&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr> 
    <td height="25"></td>
    <td valign="top"><div align="center"> 
        <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0" width="100" height="22">
          <param name="BASE" value=".">
          <param name="BGCOLOR" value="">
          <param name="movie" value="kontakt.swf">
          <param name="quality" value="high">
          <param name="wmode" value="transparent">
          <embed src="kontakt.swf" width="100" height="22" quality="high" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" wmode="transparent" base="." ></embed> 
        </object>
      </div></td>
    <td>&nbsp;</td>
  </tr>
  <tr> 
    <td height="26"></td>
    <td valign="top"><!--DWLayoutEmptyCell-->&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr> 
    <td height="25"></td>
    <td valign="top"><div align="center"> 
        <div align="center"> 
          <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0" width="100" height="22">
            <param name="BASE" value=".">
            <param name="BGCOLOR" value="">
            <param name="movie" value="impressum.swf">
            <param name="quality" value="high">
            <param name="wmode" value="transparent">
            <embed src="impressum.swf" width="100" height="22" quality="high" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" wmode="transparent" base="." ></embed> 
          </object>
        </div>
      </div></td>
    <td>&nbsp;</td>
  </tr>
  <tr> 
    <td height="284"></td>
    <td></td>
    <td></td>
  </tr>
  <tr> 
    <td height="40"></td>
    <td></td>
    <td width="75">&nbsp;</td>
    <td></td>
    <td width="127">&nbsp;</td>
    <td width="68" valign="top"><div align="right"><a href="index.html" target="_self"><img src="Bilder/deutschland.gif" width="30" height="20" border="0"></a></div></td>
    <td width="68" valign="top"><div align="center"><a href="englisch/index.html" target="_self"><img src="Bilder/grossbritannien.gif" width="30" height="20" border="0"></a></div></td>
    <td></td>
  </tr>
  <tr> 
    <td height="1"></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
  </tr>
  <tr> 
    <td height="1"><img src="../schulzke/bild_index1.jpg" alt="" width="22" height="1"></td>
    <td><img src="../schulzke/bild_index1.jpg" alt="" width="173" height="1"></td>
    <td><img src="../schulzke/bild_index1.jpg" alt="" width="75" height="1"></td>
    <td></td>
    <td><img src="../schulzke/bild_index1.jpg" alt="" width="127" height="1"></td>
    <td><img src="../schulzke/bild_index1.jpg" alt="" width="68" height="1"></td>
    <td><img src="../schulzke/bild_index1.jpg" alt="" width="68" height="1"></td>
    <td><img src="../schulzke/bild_index1.jpg" alt="" width="1" height="1"></td>
  </tr>
</table>

</body>
</html>
 
Füge mein Stylesheet einfach in das Vorhandene ein:

HTML: 
<style type="text/css">
<!--
BODY {
background-attachment: fixed;
background-image: url(Bilder/hintergrund1024.jpg);
background-position: center center;
background-repeat: no-repeat;
height: 100%;
width: 100%;
visibility: visible;
position: static;
z-index: 1;
right: 100%;
left: 100%;
overflow: auto;
top: auto;
bottom: auto;
scroll: auto;
}

input.text 
{
background: #dfdfdf;
color: #2f2f2f;
}
-->
</style>
Und ergänze das <input>-Element mit dem Attribut class="text".
 
Hilf mir mal eben schnell auf die Sprünge...
Du meinst in der Zeile

<td width="234" valign="top"> <input type="text" name="name" value size="35"></td>

einfach an das input ein .text hintersetzen?

weil wenn ich das mache ist das Textfeld weg

//edit

Ach ich bin doof.... klar habs hinbekommen, vielen Dank
 
und wie bekomme ich das in einer Auswahlbox hin?

<td height="28" colspan="2" align="right" valign="top"> <div align="center"><font color="#FFFFFF" face="Arial,helvetica" size="-1">Ihre
Art der Anfrage:&nbsp;</font></div></td>
<td valign="top"> <select name="select2">
<option selected>Studiobau</option>
<option>K&uuml;chenmontage</option>
<option>M&ouml;belmontage</option>
</select></td>
</tr>
 
Ohne CSS-Klasse
Code: 
select
{
background: #dfdfdf;
color: #2f2f2f;
}
Mit CSS-Klasse:
Code: 
select.style
{
background: #dfdfdf;
color: #2f2f2f;
}
HTML: 
<select name="select2" class="style">
<option selected>Studiobau</option>
<option>K&uuml;chenmontage</option>
<option>M&ouml;belmontage</option>
</select>
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück