Wie kann man den Hintergrund so machen wie in diesem Beispiel?

[padde95]

Hallo,

ich habe mich gerade angemeldet, da ich langsam verzweifel Undzwar habe ich bei meiner Testwebsite (ich fange gerade erst an CSS zu lernen) ein Formular erstellt und per CSS positioniert. Nun ist das Formular zwar an der richtigen Stelle sieht aber nicht besonder anschaulich aus. Da dachte ich mir, ich gestalte das Formular wie bei Twitter (Twitter) mit einem Hintergrund oder Rahmen (?). Wenn ich um das Formular einen Rahmen setze kommt nur ein Rahmen um das komplette Formular, der Rest behält jedoch meine angegebene Hintergrundfarbe. Und wenn ich ein Bild einfüge, setzt es sich vor das Formular und man sieht nichts mehr.

Könnt ihr mir da helfen? Am besten mit einem Codebeispiel ;) (Also am Ende sollte es ungefähr so aussehen wie bei Twitter)


Gruß padde

 

[noxTo]

den container in dem dein formular liegt ansprechen als kein plan
wen de es soch gemacht hast

<div class="formular>....hier ist das formular</div>

dann schreibste in der css

div.formular
{
 background-color: meinegeilefarbe;
}

 

[lascaux]

Du kannst die einzelnen Form-Elemente mit CSS ansprechen

input {
  height: 20px; /* nur ein Beispiel */
  width: 200px /* nur ein Beispiel */
  font-family: ..
  border: 1px solid #FARBE
  border-radius: 20px; /* nur als Beispiel */
  background: #FARBE;
}

textarea {
  siehe oben
  resize: none; /* hier ganz interessant */
}

usw.

Per CSS kannst du so ziemlich alle Form-Elemente nach belieben gestalten und verändern (nur die Funktion des Elements nicht).

mit <input type="file" /> könntest du jedoch etwas Schwierigkeiten bekommen beim umgestalten, es geht jedoch auch, mit einem Trick.


lascaux