Jump to content
Team-Umstellung ×
- Werbung nur für Gäste -

IGNORIERT

Kontaktformuler mit HTML. Wer kann helfen?

Judge_of_Death-_

Von Judge_of_Death-_
in PC & Konsolen

Recommended Posts

- Werbung nur für Gäste -

Judge_of_Death-_

Judge_of_Death-_

Geschrieben
  • Autor
Geschrieben
@MiniMarc und einige andere:

Ich weiss selbst, dass man normalerweise keine tables mehr benutzt.

Aber was gebt ihr ihm alles für Ratschläge? Achtet doch mal darauf, was er geschrieben hat! Er macht das für die Schule, sprich es ist eine Aufgabe und danach kommt die Nächste. Außerdem hat er gesagt, dass er keinerlei Vorkenntnisse hat.

Und jetzt erzähl mir bitte nicht, dass jeder, der gerade ANFÄNGT html zu erlernen direkt zu CSS und sonstigen Scripts greifen sollte. Man fängt numal mit den Grundlagen an, und dazu zählen auch tables!

Und was kommt ihr jetzt auch noch mit Captchas etc.? Er macht das für die Schule, sprich er wirds wahrscheinlich nie in dieser Form selbst online verwenden.

Möchte hiermit keinen angreifen, möchte nur aufzeigen, dass man einen schon genug verwirrten Anfänger durch solche Statements noch viel mehr verwirren kann.

Es ging mir ja eigtl ja nur darum, dass wenn eine Schule eine Aufgabe stellt, und die so nicht lösbar ist, nämlich mit reinem HTML, dann muss ich mich stark wundern.

Ist mir schon klar;)

Darf ja auch eigentlich so gut wie alles benutzen.

Mir ging´s nur vorrangig um HTML

Kann mir jetzt bitte jemand wegen den Abständen helfen?

Und wie bekomme ich bitte einen farbigen Kasten um das ganze, wie´s bei dem anderen Dokument gemacht war?

Edit: Habe das ganze jetzt mal in eine Tabelle gepackt.

Aber warum ist die Schrift jetzt bei den vorderen Wörtern so groß?:(

Und wie kann ich es machen, dass die Wörter alle nach links eingerückt sind?

Hier der Quelltext:

<html><head><title>"Kontaktformuler "Medien""</title><meta name="author" content="Marcel"><meta name="editor" content="html-editor phase 5"></head><body bgcolor="grey"><form action="mailto:info@rs-rees.net" method="post" enctype="text/plain"><table>     <tr> <th>Name:</th> <th><input name="Name" size="20"> </th> </tr>     <tr> <th>Geburtstag:</th> <th><input name:"Datum" size="20"> </th> </tr>     <tr> <th>Deine Email:</th> <th><input name="Email" size="20"></th> </tr>     <tr> <th>Email bestätigen:</th> <th><input name="Email2" size="20"></th> </tr>     </table>Welcher der unten genannten Punkte interessiert dich am meisten?<br><select name="bereich" size="3"><option> Internet       </option><option> TV             </option><option> Zeitung        </option><option> Spielekonsolen </option></select><br><br>Womit beschäftigst du dich im Internet am meisten? ?<br><input type="checkbox" name="interesse" value="Foren">Foren<br><input type="checkbox" name="interesse" value="Chatprogramme">Chatprogramme<br><input type="checkbox" name="interesse" value="Solziale Netzwerke">Soziale Netzwerke<br><input type="checkbox" name="interesse" value="YouTube">YouTube<br><br>Wie oft benutzt du das im Internet in der Woche?<br><input type="radio" name="besuch" value="tag">Täglich!<br><input type="radio" name="besuch" value="woche">Mehrmals pro Woche<br><input type="radio" name="besuch" value="selten">1-2 mal in der Woche<br><br><input type="submit" value="Abschicken!"><input type="reset" value="Abbrechen"></form></body></html>

Kann mir jemand sagen, wofür die fett markierte Zeile gut ist?

Ist das die Ziel Emailadresse?

Link zu diesem Kommentar
Auf anderen Seiten teilen
MiniMarc

MiniMarc

Geschrieben
Geschrieben

Also Abstände kannst du so machen:

<input style="padding: 10px" /> oder

<input style="margin: 10px" />

padding = Innenabstand, margin = Aussenabstand. Musst du evtl ein wenig rumprobieren bis es passt.

http://www.christian-noss.de/blog/nba_08/wp-content/uploads/2008/06/box_modell.png

Um einen "Kasten" um das ganze zu bekommen würde ich vor dem form-Tag ein <div style="background: red"> starten und danach (nach </form>) das wieder zumachen mit </div>

Link zu diesem Kommentar
Auf anderen Seiten teilen
Judge_of_Death-_

Judge_of_Death-_

Geschrieben
  • Autor
Geschrieben
Also Abstände kannst du so machen:

<input style="padding: 10px" /> oder

<input style="margin: 10px" />

padding = Innenabstand, margin = Aussenabstand. Musst du evtl ein wenig rumprobieren bis es passt.

http://www.christian-noss.de/blog/nba_08/wp-content/uploads/2008/06/box_modell.png

Um einen "Kasten" um das ganze zu bekommen würde ich vor dem form-Tag ein <div style="background: red"> starten und danach (nach </form>) das wieder zumachen mit </div>

Das mit dem Padding habe ich noch nicht ganz verstanden:D

Das mit dem Kasten funktioniert:)

Allerdings bedeckt er so gut wie alles :/

Kann ich ihn nicht irgendwie so einstellen, dass er bspw nur um die Tabelle oben herum geht und nicht um alles?

Vorallem bedeckt er auch noch die ganze rechte Seite, die ja eigentlich grau bleiben soll, damit sich das ganze abhebt

Edit:

Wer suchet der findet :)

Habe die Tabelle gefärbt.:)

Allerdings hätte ich den Bereich um die anderen "Felder" drumherum auch gerne in einer anderen Farbe, damit sie sich vom Hintergrund abheben..

Habe es im übrigen einfach so gemacht:

<table bgcolor="lightgrey"> ;)

Link zu diesem Kommentar
Auf anderen Seiten teilen
TheKremsi

TheKremsi

Geschrieben
Geschrieben
Das mit dem Padding habe ich noch nicht ganz verstanden:D

Das mit dem Kasten funktioniert:)

Allerdings bedeckt er so gut wie alles :/

Kann ich ihn nicht irgendwie so einstellen, dass er bspw nur um die Tabelle oben herum geht und nicht um alles?

Vorallem bedeckt er auch noch die ganze rechte Seite, die ja eigentlich grau bleiben soll, damit sich das ganze abhebt

Edit:

Wer suchet der findet :)

Habe die Tabelle gefärbt.:)

Allerdings hätte ich den Bereich um die anderen "Felder" drumherum auch gerne in einer anderen Farbe, damit sie sich vom Hintergrund abheben..

Habe es im übrigen einfach so gemacht:

<table bgcolor="lightgrey"> ;)

Probiers doch mal mit Stylesheets also CSS, damit kannst das besser gestalten.

Link zu diesem Kommentar
Auf anderen Seiten teilen
- Werbung nur für Gäste -

RedrAVEN

RedrAVEN

Geschrieben
Geschrieben

Also wenn du allem eine Hintergrundfarbe geben möchtest, wäre es wohl so am einfachsten:

<div style="float:left; background-color:lightgrey">

Das setzt du am besten direkt hinter das <body>-Tag. und machst es dann natürlich vorm Ende des bodys wieder mit </div> zu.

Nun zu der Frage, warum der Text von Name, Geburtstag etc fett ist:

Änder dazu einfach all deine <th>-Tags in <td>

th = table-head (Überschrift)

td = table-data (alles andere)

Wenn du dabei was nicht verstehst, kann ichs auch gerne noch genauer erläutern (insbesondere "Was macht div?" oder "Was ist float?" :biggrin5: ). Steht aber auch alles recht einfach auf selfHTML.

Viel Spaß weiterhin mit html ;)

Link zu diesem Kommentar
Auf anderen Seiten teilen
Judge_of_Death-_

Judge_of_Death-_

Geschrieben
  • Autor
Geschrieben

Habe mir jetzt nochmal ein bisschen von meinem Kollegen Homer helfen lassen und jetzt sieht´s so aus:)

<html> <head> <title>"Kontaktformuler "Medien""</title> <meta name="author" content="Marcel"> <meta name="editor" content="html-editor phase 5"> </head> <h1><u>Umfrage</u></h1> <body bgcolor="grey"> <form action="mailto:info@rs-rees.net" method="post" enctype="text/plain"> <div style="background-color:lightgrey; margin:0px; padding:6px; width:236px;"> <table> <tr> <td>Name:</td> <td><input name="Name" size="20"> </th> </tr> <tr> <td>Geburtstag:</td> <th><input name:"Datum" size="20"> </th> </tr> <tr> <td>Deine Email:</td> <th><input name="Email" size="20"></th> </tr> <tr> <td>Email bestätigen:</td> <th><input name="Email2" size="20"></th> </tr> </table></div><br>  <div style="background-color:lightgrey; margin:0px; padding:6px; width:236px;">Welcher der unten genannten Punkte interessiert dich am meisten?<br> <select name="bereich" size="3"> <option> Internet </option> <option> TV </option> <option> Zeitung </option> <option> Spielekonsolen </option> </select><br></div><br>  <div style="background-color:lightgrey; margin:0px; padding:6px; width:236px;">Womit beschäftigst du dich im Internet am meisten? ?<br> <input type="checkbox" name="interesse" value="Foren">Foren<br> <input type="checkbox" name="interesse" value="Chatprogramme">Chatprogramme<br> <input type="checkbox" name="interesse" value="Solziale Netzwerke">Soziale Netzwerke<br> <input type="checkbox" name="interesse" value="YouTube">YouTube<br></div><br>  <div style="background-color:lightgrey; margin:0px; padding:6px; width:236px;">Wie oft benutzt du das im Internet in der Woche?<br> <input type="radio" name="besuch" value="tag">Täglich!<br> <input type="radio" name="besuch" value="woche">Mehrmals pro Woche<br>  <input type="radio" name="besuch" value="selten">1-2 mal in der Woche<br></div><br>  <input type="submit" value="Abschicken!"> <input type="reset" value="Abbrechen"> </form> </div> </body> </html>

Finde ich persöhnlich schonmal sehr ansprechend:)

Habe nochmal nachgefragt und ich soll es mit Hilfe von JavaScript so machen, dass wenn ich auf Senden klicke eine neue Seite geladen wird, auf der alle eingegebenen Daten angezeigt werden. Sozusagen als bestätigungsseite, bei der man nochmal ok drücken muss.

ISt das viel Akt?

Link zu diesem Kommentar
Auf anderen Seiten teilen
EndOfGreen666

EndOfGreen666

Geschrieben
Geschrieben
Habe mir jetzt nochmal ein bisschen von meinem Kollegen Homer helfen lassen und jetzt sieht´s so aus:)
<html> <head> <title>"Kontaktformuler "Medien""</title> <meta name="author" content="Marcel"> <meta name="editor" content="html-editor phase 5"> </head> <h1><u>Umfrage</u></h1> <body bgcolor="grey"> <form action="mailto:info@rs-rees.net" method="post" enctype="text/plain"> <div style="background-color:lightgrey; margin:0px; padding:6px; width:236px;"> <table> <tr> <td>Name:</td> <td><input name="Name" size="20"> </th> </tr> <tr> <td>Geburtstag:</td> <th><input name:"Datum" size="20"> </th> </tr> <tr> <td>Deine Email:</td> <th><input name="Email" size="20"></th> </tr> <tr> <td>Email bestätigen:</td> <th><input name="Email2" size="20"></th> </tr> </table></div><br>  <div style="background-color:lightgrey; margin:0px; padding:6px; width:236px;">Welcher der unten genannten Punkte interessiert dich am meisten?<br> <select name="bereich" size="3"> <option> Internet </option> <option> TV </option> <option> Zeitung </option> <option> Spielekonsolen </option> </select><br></div><br>  <div style="background-color:lightgrey; margin:0px; padding:6px; width:236px;">Womit beschäftigst du dich im Internet am meisten? ?<br> <input type="checkbox" name="interesse" value="Foren">Foren<br> <input type="checkbox" name="interesse" value="Chatprogramme">Chatprogramme<br> <input type="checkbox" name="interesse" value="Solziale Netzwerke">Soziale Netzwerke<br> <input type="checkbox" name="interesse" value="YouTube">YouTube<br></div><br>  <div style="background-color:lightgrey; margin:0px; padding:6px; width:236px;">Wie oft benutzt du das im Internet in der Woche?<br> <input type="radio" name="besuch" value="tag">Täglich!<br> <input type="radio" name="besuch" value="woche">Mehrmals pro Woche<br>  <input type="radio" name="besuch" value="selten">1-2 mal in der Woche<br></div><br>  <input type="submit" value="Abschicken!"> <input type="reset" value="Abbrechen"> </form> </div> </body> </html>

Finde ich persöhnlich schonmal sehr ansprechend:)

Habe nochmal nachgefragt und ich soll es mit Hilfe von JavaScript so machen, dass wenn ich auf Senden klicke eine neue Seite geladen wird, auf der alle eingegebenen Daten angezeigt werden. Sozusagen als bestätigungsseite, bei der man nochmal ok drücken muss.

ISt das viel Akt?

Der hellgraue Hintergrund sollte ein bisschen größer sein. Außerdem könnte bei der ersten Frage bei den Auswahlmöglichkeiten die Scrollleiste verschwinden (overflow: hidden;)

bildschirmfoto3h.png

Eine neue Seite lädst du so mit JS: 

onclick="window.open('index.php')"
Link zu diesem Kommentar
Auf anderen Seiten teilen
- Werbung nur für Gäste -

Archiviert

Dieses Thema ist jetzt archiviert und für weitere Antworten gesperrt.
Wende dich an einen Admin, wenn du in diesem Thema etwas posten möchtest.

Gehe zur Themenübersicht
×
×
  • Neu erstellen...