Come fare un modulo di contatto in HTML5

November 30

HTML 5 è la quinta revisione del linguaggio di Web design universalmente accettata, Hypertext Markup Language o HTML. Un modulo di contatto consente di posizionare i campi vuoti sul tuo sito web che un visitatore può compilare e inviare. Gli sviluppatori o proprietari di siti possono utilizzare moduli di contatto per ricevere feedback utili, domande o altre informazioni da parte dei visitatori. HTML 5 offre nuove tipologie di input per moduli di contatto che si integrano bene con molti browser per dispositivi mobili smartphone e tablet.

istruzione

1 Aprire il file HTML che si desidera creare un modulo di contatto nel usando notepad o un editor HTML preferito.

2 Inserire il seguente codice nella pagina in cui si desidera che il modulo di contatto a comparire, per avviare il modulo:

<Fieldset>

3 Inserire il seguente codice sotto il tag "<fieldset>" aprendo per creare la prima forma:

<Label> Nome </ label>

<Input type = "text" segnaposto = "Digitare qui">

4 Modifica "Nome" per l'etichetta che si desidera visualizzare al di sopra del campo di modulo. Ad esempio, è possibile specificare "Indirizzo e-mail" o "numero di telefono".

5 Cambiamento "<input type =" text "per il tipo di campo che si desidera creare. Comunemente usato HTML 5 campi sono" testo "," e-mail "e" URL ". Ogni tipo permette agli utenti di inserire diversi tipi di informazioni. Testo campi consentono agli utenti di stringhe di input di testo, i campi di posta elettronica consentono agli utenti di inserire il testo e numeri sotto forma di un indirizzo email e URL consente agli utenti di inserire il testo in formato indirizzo Web.

6 Sostituire "Digita qui" con il testo segnaposto o le istruzioni che si desidera visualizzare pre-popolato nel campo. Ad esempio, in un campo di e-mail, è possibile inserire il testo segnaposto "Inserire indirizzo e-mail".

7 Aggiungi come molte forme a piacere, utilizzando il codice di esempio nel passaggio 3. Inoltre, se si desidera aggiungere una casella di testo che consente agli utenti di inserire grandi quantità di testo, aggiungere la seguente stringa di codice:

<Label> Commenti </ label>

<Textarea tipo = "messaggio" segnaposto = "Commenti in più qua"> </ textarea>

Apportare modifiche a "Commenti" per modificare il testo dell'etichetta e "Extra Commenti Qui" per modificare il testo segnaposto nella casella di testo.

8 Aggiungere il seguente codice nella parte inferiore della tutte le forme per creare un pulsante di invio:

<Input type = "submit" value = "Send">

Cambiare "Invia" per il testo che si desidera visualizzare sul pulsante di invio.

9 Inserire il seguente tag di chiusura sotto tutte le forme:

</ Fieldset>

10 Salvare il file e caricarlo sul server.

Consigli e avvertenze

  • Utilizzare PHP con la forma di elaborare e validare le informazioni fornite dai visitatori sul modulo.
  • Aggiungere stile CSS per i moduli per cambiare come la forma appare nel browser del visitatore.