Warum unterscheidet sich die Ausgabe im angegebenen HTML-Code?

Question

Wenn ich die HTML-Datei mit dem Code-Snippet, unten erwähnt, öffne, sehe ich in meinem Browser ein Kontrollkästchen und eine Schaltfläche zum Absenden.

<form > 
    <input type = "checkbox" name = "q"> 
    <input type = "submit"> 
</form> 

Allerdings, wenn ich die erste Zeile zusammen mit dem Formular bewegen (wie im Code-Schnipsel unten) und dann die Datei in meinem Browser neu zu laden, ich sehe nicht das Kontrollkästchen. Ich sehe nur den Senden-Button. Ich folge daraus, dass die Erwähnung der ersten Zeile zusammen mit form keyword etwas anderes bedeutet. Kann jemand erklären, was der Unterschied ist?

<form input type = "checkbox" name = "q"> 
     <input type = "submit"> 
</form> 

PS: Ich bin neu in HTML und Web-Entwicklung. Dies kann eine Frage ohne Frage sein.

Answer 1

Per Definition wird das Tag <form> verwendet, um ein HTML-Formular für Benutzereingaben zu erstellen. Dieses Formular enthält weitere Elemente wie <input>, <button>, <textarea>, usw. Diese Elemente können nicht in das form-Tag eingefügt werden.

Wenn Sie schreiben:

<form input type = "checkbox" name = "q"> 

es schafft ein Element form mit Attributen type="checkbox", name="q" und input="" und daher ist es nicht das Kontrollkästchen erstellen Sie wollten.

Das richtige Format ist:

<form> 
    <!-- form content --> 
</form> 

Answer 2

Ein Formular und eine Eingabe sind zwei verschiedene Arten von Elementen. Du kannst sie nicht einfach zusammenfügen, es ergibt keinen Sinn. Wenn Sie einen Eingang wollen, müssen Sie

Für ein bisschen Erklärung ein Eingabeelement haben, wenn Sie einen Tag wie öffnen, so:

<form 

alles, was Sie innerhalb thhat Tag eingeben, bevor es durch eine geschlossen ist '>' ist normalerweise eine Eigenschaft dieses Elements. Z.B.

<form prop1='a' prop2='b'> 
    blah blah 
</form> 

Solche Eigenschaften würden Dinge wie Klassen oder IDs. Ein Element darf keine Eigenschaft sein.