Nwlapcug.com


Come fare un modulo di contatto in HTML5

HTML 5 è la quinta revisione per il linguaggio di design Web 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 i proprietari del sito possono utilizzare moduli di contatto per ricevere utili feedback, domande o altre informazioni da parte dei visitatori. HTML 5 offre nuovi tipi di input per i moduli di contatto che si integrano bene con molti browser mobili, smartphone e tablet.

Istruzioni

1

Aprire il file HTML che si desidera creare un modulo di contatto utilizzando blocco note o il tuo preferito HTML editor.

2

Inserire il codice seguente nella pagina dove si desidera il modulo di contatto a comparire, per avviare il modulo:

< fieldset >

3

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

< label > nome < / etichetta >

< input type = "segnaposto" = "Digitare qui" >

4

Modificare "Nome" per l'etichetta che si desidera venga visualizzato sopra il campo modulo. Ad esempio, è possibile specificare "Indirizzo Email" o "Numero di telefono."

5

Cambiamento "< input type ="text"per il tipo di campo che si desidera creare. Campi HTML 5 comunemente utilizzati includono "testo", "email" e "URL". Ciascun tipo consente agli utenti di inserire diversi tipi di informazioni. Campi di testo consentono agli utenti di stringhe di input di testo, campi di posta elettronica consentono agli utenti di immettere testo e numeri in forma di un indirizzo email e URL consente agli utenti di immettere testo in formato di indirizzo Web.

6

"Digitare qui" sostituire il testo segnaposto e le istruzioni che si desidera venga visualizzato pre-popolate nel campo. Ad esempio, in un campo di posta elettronica, si potrebbe inserire il testo del segnaposto "Inserire indirizzo di posta elettronica".

7

Aggiungere forme come molti come si desidera, utilizzando il codice di esempio nel passaggio 3. Inoltre, se si desidera aggiungere una casella di testo area che permette agli utenti di immettere grandi quantità di testo, aggiungere la seguente stringa di codice:

Commenti < label > < / etichetta >

< tipo textarea = segnaposto "messaggio" = "Extra commenti qui" >< / textarea >

Apportare modifiche ai "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 di tutte le forme per creare un pulsante di invio:

< input type = "submit" value = "Invia" >

Modificare "Inviare" il testo che si desidera venga visualizzato sul pulsante Invia.

9

Il seguente tag di chiusura sotto tutte le forme di input:

< / fieldset >

10

Salvare il file e caricarlo sul server.

Consigli & Avvertenze

  • Utilizzare PHP con il modulo per elaborare e convalidare le informazioni fornite dai visitatori del form.
  • Aggiungere stili ai moduli CSS per modificare l'aspetto della forma nel browser del visitatore.