HTML <form> ετικέτα

  • Προηγούμενη Σελίδα <footer>
  • Επόμενη Σελίδα <frame>

Ορισμός και χρήση

<form> Η ετικέτα χρησιμοποιείται για τη δημιουργία HTML φόρμας για την παραλαβή εισαγωγής χρηστών.

<form> Ο στοιχείο μπορεί να περιέχει έναν ή περισσότερους από τους παρακάτω στοιχεία φόρμας:

Για περισσότερες πληροφορίες:

Εκμάθηση HTML:HTML Φόρμα και Εισαγωγή

Εγχειρίδιο HTML DOM:Ετικέτα Form

CSS Εκμάθηση: Ρύθμιση στυλ φόρμας

Παράδειγμα

Παράδειγμα 1

HTML μορφότυπο με δύο πεδία εισαγωγής και κουμπί υποβολής:

<form action="/action_page.php" method="get">
  <label for="fname">Όνομα:</label>
  <input type="text" id="fname" name="fname"><br><br>
  <label for="lname">Επίθετο:</label>
  <input type="text" id="lname" name="lname"><br><br>
  <input type="submit" value="Υποβολή">
</form>

Δοκιμάστε Εξοπλιστικά

Παράδειγμα 2

HTML μορφότυπο με κουτάκια επιλογής:

<form action="/action_page.php" method="get">
  <input type="checkbox" name="vehicle1" value="Bike">
  <label for="vehicle1">Εχω μια ποδήλατο</label><br>
  <input type="checkbox" name="vehicle2" value="Car">
  <label for="vehicle2">Εχω ένα αυτοκίνητο</label><br>
  <input type="checkbox" name="vehicle3" value="Boat" checked>
  <label for="vehicle3">Εχω μια βαρκά</label><br><br>
  <input type="submit" value="Υποβολή">
</form>

Δοκιμάστε Εξοπλιστικά

Παράδειγμα 3

Η HTML φόρμα με επιλογές

<form action="/action_page.php" method="get">
  <input type="radio" id="html" name="fav_language" value="HTML">
  <label for="html">HTML</label><br>
  <input type="radio" id="css" name="fav_language" value="CSS" checked="checked">
  <label for="css">CSS</label><br>
  <input type="radio" id="javascript" name="fav_language" value="JavaScript">
  <label for="javascript">JavaScript</label><br><br>
  <input type="submit" value="Υποβολή">
</form>

Δοκιμάστε Εξοπλιστικά

Ιδιότητα

Ιδιότητα Τιμή Περιγραφή
accept-charset Συλλογή χαρακτήρων Ορίζει το χαρακτήρα κώδικα που θα χρησιμοποιηθεί κατά την υποβολή της φόρμας.
action URL Ορίζει πού θα αποσταλεί η φόρμα κατά την υποβολή της.
autocomplete
  • on
  • off
 Ορίζει αν η φόρμα πρέπει να ενεργοποιήσει τη λειτουργία αυτόματης ολοκλήρωσης.
enctype
  • application/x-www-form-urlencoded
  • multipart/form-data
  • text/plain
 Ορίζει πώς θα κωδικοποιηθούν τα δεδομένα της φόρμας κατά την υποβολή τους στο διακομιστή.
method
  • get
  • post
 Ορίζει το HTTP μέθοδο που χρησιμοποιείται κατά την αποστολή δεδομένων της φόρμας.
name text Ορίζει το όνομα της φόρμας.
novalidate novalidate Ορίζει ότι η φόρμα δεν πρέπει να ελεγχθεί κατά την υποβολή της.
rel
  • external
  • help
  • license
  • next
  • nofollow
  • noopener
  • noreferrer
  • opener
  • prev
  • search
 Ορίζει τη σχέση μεταξύ του πόρου σύνδεσης και του τρέχοντος έγγραφου.
target
  • _blank
  • _self
  • _parent
  • _top
 Ορίζει πού θα εμφανιστεί η απάντηση που λαμβάνεται μετά την υποβολή της φόρμας.

Οι παγκόσμιες ιδιότητες

<form> Η ετικέτα υποστηρίζει Οι παγκόσμιες ιδιότητες στο HTML。

Η ιδιότητα συμβάντος

<form> Η ετικέτα υποστηρίζει Η ιδιότητα συμβάντος στο HTML。

Προεπιλεγμένες Ρυθμίσεις CSS

Παλαιότερες περιηγητές θα χρησιμοποιήσουν τις ακόλουθες προεπιλεγμένες τιμές για την εμφάνιση <form> Στοιχεία:

form {
  display: block;
  margin-top: 0em;
}

Δοκιμάστε Εξοπλιστικά

Υποστήριξη Browser

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Υποστήριξη Υποστήριξη Υποστήριξη Υποστήριξη Υποστήριξη
  • Προηγούμενη Σελίδα <footer>
  • Επόμενη Σελίδα <frame>