Per testi voluminosi, ad esempio per messaggi di posta, è conveniente utilizzare questo particolare elemento. È creato dai tag e ha i seguenti parametri:
– nome- nome del campo,
– col- larghezza del campo in caratteri,
– righe- numero di righe di testo visibili sullo schermo,
– avvolgere- modalità di trasferimento delle parole:
– spento- non avviene alcun trasferimento,
– virtuale- il trasferimento viene visualizzato, ma il server riceve una stringa indivisibile,
– fisico- trasferimento sia sullo schermo che all'arrivo sul server.
– Disabilitato- campo inattivo,
– sola lettura- è consentita la sola lettura.
Risultato:
Elenchi a discesa
Gli elenchi possono essere a elemento singolo o a selezione multipla. Entrambi sono specificati utilizzando i tag , all'interno del quale si trovano gli elementi di valore, specificato dal tag Diamo un'occhiata ai parametri di questi tag:
– nome- lista nome. Ogni elemento della lista selezionata, una volta trasferito al server, avrà il seguente aspetto: nome.valore, dove il valore è preso dal tag opzione;
– misurare- determina il numero di elementi visibili nell'elenco: 1 - un semplice elenco a discesa, più di 1 - un elenco con barra di scorrimento;
– multiplo- Consente la selezione di più elementi dell'elenco.
– selezionato- viene utilizzato per contrassegnare l'elemento della lista che con maggiore probabilità verrà selezionato; se la lista ha una scelta multipla, è possibile contrassegnare più elementi;
– valore- il valore che verrà inviato al server se la voce viene selezionata.
Che lingua vuoi imparare:
Quanto tempo sei disposto a dedicare a questo:
Quali giorni della settimana sono adatti per le lezioni:
(selezionare con premuto tasto ctrl)
Risultato:
Ci sono anche dei tag<gruppo opt>... , permettendoti di raggruppare gli elementi dell'elenco secondo alcuni criteri. Ad esempio, per creare un catalogo di siti sotto forma di elenco, è più conveniente dividerlo in gruppi per interesse. Si prega di notare in questo caso i tag di chiusura devono essere specificati. Codice d'esempio:
Catalogo dei siti:
Risultato:
Iscrizioni
Tutti gli elementi del modulo possono essere associati alle rispettive etichette utilizzando l'elemento e il suo parametro for, il cui valore è il nome dell'elemento a cui associamo l'etichetta. Per esempio:
Risultato:
Condizione lavorativa
Secondo l'opzione, creare un modulo per l'immissione dei dati. La pagina dovrebbe contenere i seguenti elementi visivi:
1. titolo;
2. testo che spiega lo scopo del modulo;
3. modulo di inserimento dati, secondo l'opzione. Seleziona tu stesso le tipologie di elementi per l'inserimento dei dati (almeno 3 diversi);
4. scavare – “ INVIARE», « CHIARO»;
5. informazioni sul creatore della pagina – Nome e cognome, gruppo, e-mail.
Figura 1 – Visualizzazione approssimativa della pagina
Aggiungi un pulsante a ciascun campo del modulo Spiegazione", quando si clicca, si apre una finestra con informazioni esplicative e/o un'immagine, il pulsante " VICINO».
Quando si preme il pulsante " INVIARE", viene verificata la correttezza dei dati del modulo: tutti i campi sono compilati, campi numerici contenere valori validi, rimuove gli spazi iniziali e finali. Se i dati in uno o più campi non corrispondono, dovrebbe essere visualizzata una finestra in cui dovrebbero essere visualizzati il nome e un breve testo che spiega i requisiti per i dati inseriti nel campo. Se i dati sono inseriti correttamente, i dati vengono inviati dopo la conferma nella finestra di dialogo. Inseriscine due sul modulo campi nascosti Con data odierna e l'ora, che vengono anche trasmessi al server. Forma approssimativa:
Figura 2 – Vista approssimativa del modulo di inserimento dati
Tabella 1 – Opzioni per i moduli di inserimento dati
Opzione | Descrizione |
Officina, zona, nome completo Volume di lavoro svolto | |
UDC, nome completo Autore, Nome, Quantità | |
Numero del treno, Nome, Luogo di partenza, Luogo di arrivo, Categoria | |
Organizzazione, nome completo, anno di nascita, Posto occupato | |
Paese, area, popolazione, continente, capitale | |
Marca auto, Numero, Colore, Anno di costruzione, Chilometraggio | |
Razza del cane, Soprannome, Padre, Madre, Data di nascita, Nome completo del proprietario | |
Tipo di verdura, Nome della varietà, Data di semina, Data di raccolta, Raccolta | |
Disciplina, Ambito delle lezioni, Ambito dei laboratori, Tipo di controllo, Gruppo | |
Data, Temperatura, Pressione, Nuvolosità, Direzione del vento | |
Nome, Azienda, Costo, Quantità, Data | |
Nome della band, Paese, Album, Data di uscita, Numero di vendita | |
Nome della vetta, Altitudine, Nazione, Anno di conquista, Numero di salite | |
Nome completo, Anno di nascita, Altezza, Peso, Gruppo sanguigno | |
Nome completo, Campo di attività, Anno di nascita, Nazione, Numero di pubblicazioni |
Domande di controllo
1. Descrivi il tag da creare campo di testo. Fornisci la sua sintassi.
2. Descrivere un tag per creare un campo di testo per l'immissione di una password. Fornisci la sua sintassi.
3. Descrivi il tag per la creazione delle caselle di controllo. Fornisci la sua sintassi.
4. Descrivi il tag per la creazione dei pulsanti. Fornisci la sua sintassi.
5. Descrivere un tag per creare un campo di selezione file. Fornisci la sua sintassi.
6. Descrivere un tag per creare un campo di testo multilinea. Fornisci la sua sintassi.
7. Descrivi il tag per creare un elenco a discesa. Fornisci la sua sintassi.
Insegnante Stishenok E.O.
Farberov A.G.
Questo elemento del modulo è progettato per creare un'area in cui è possibile inserire più righe di testo. In un campo di testo di questo tipo è consentito inserire interruzioni di riga; vengono salvate durante l'invio dei dati al server.
Il campo di testo su più righe è indispensabile per aggiungere commenti ad articoli, scrivere post su forum, inserire e modificare post di blog e molti altri casi in cui una riga di testo chiaramente non è sufficiente.
La sintassi per creare un campo è la seguente.
Tra i tag È possibile inserire qualsiasi testo che verrà visualizzato all'interno del campo. Se non è presente testo, il campo sarà inizialmente vuoto.
Gli attributi validi sono elencati nella tabella. 1.
La creazione di un campo per testo su più righe è mostrata nell'esempio 1.
Esempio 1: campo di testo
Il risultato dell'esempio è mostrato in Fig. 1.
Riso. 1. Visualizzazione del campo di testo predefinita
Per
IN
Esempio 2: campo di testo con testo
Il risultato di questo esempio è mostrato in Fig. 2. Tieni presente che tutti gli spazi e le interruzioni di riga all'interno vengono presi in considerazione
Riso. 2. Campo di testo
In genere le dimensioni
Per creare un'area in cui è possibile inserire più righe di testo, utilizzare l'elemento
Il campo di testo su più righe è indispensabile per aggiungere commenti ad articoli, scrivere post su forum, inserire e modificare post di blog e molti altri casi in cui una riga di testo chiaramente non è sufficiente. La sintassi per creare un campo è la seguente.
Tra i tag È possibile inserire qualsiasi testo che verrà visualizzato all'interno del campo. Se non è presente testo, il campo sarà inizialmente vuoto.
Gli attributi validi sono elencati nella tabella. 1.
La creazione di un campo di testo multilinea è mostrata nell'Esempio 1.
Nessuno di questi attributi è richiesto, quindi un semplice modulo di invio di testo assomiglia a questo (esempio 1).
Esempio 1: campo di testo
Il risultato dell'esempio è mostrato in Fig. 1.
Riso. 1. Visualizzazione del campo di testo predefinita
Quando si progetta un campo su più righe, vengono applicate le stesse proprietà di stile del testo su riga singola. Vale a dire, puoi modificare la larghezza (proprietà della larghezza), l'altezza (altezza), il bordo (bordo), il colore del testo e dello sfondo (rispettivamente colore e sfondo), ecc. Un esempio di creazione di un campo di testo con caratteristiche diverse è fornito nell'esempio 2.
Esempio 2. Progettazione del campo di testo
Il risultato di questo esempio è mostrato in Fig. 2.
Riso. 2. Modificare l'aspetto del campo di testo
Tutti i browser tranne Internet Explorer supportano il ridimensionamento per
Nell'ultima lezione video abbiamo imparato come creare un elenco a discesa in HTML. Abbiamo studiato diversi tag e abbiamo visto come funziona il tutto con esempi dal vivo.
Oggi studieremo un altro paio di tag e i loro attributi. Impariamo come aggiungere un campo per inserire testo su più righe in un modulo. E parliamo di un altro modo per aggiungere pulsanti a un modulo HTML.
Tag textarea HTML: testo su più righe.
Etichetta
Vale anche la pena notare che il tag HTML
L'attributo cols è responsabile della larghezza del campo, misurata dal numero di caratteri che possono essere scritti in una riga. E dopo che il numero di caratteri raggiunge il massimo, specificato nell'attributo cols, il file nuova linea. Inoltre, quando si specifica la larghezza, il campo stesso assumerà immediatamente la dimensione specificata in caratteri.
L'attributo righe è responsabile dell'altezza del campo misurata dal numero di righe. Ma qui vale la pena notare che se la quantità di testo supera il numero di righe specificato, ciò non significa che non saremo in grado di scrivere ulteriormente, apparirà semplicemente una barra di scorrimento e l'area di testo visibile avrà l'altezza specificata nel valore dell'attributo rows.
Esempio di codice HTML per un campo di input di testo su più righe. Non dimenticare che questo codice deve trovarsi tra i tag
Inserisci la tua recensione:
Risultato di esempio Browser Chrome mostrato in Fig. 1.
Riso. 1. Visualizzazione del campo di testo predefinita
Inoltre, il campo può trovarsi in due stati: bloccato e di sola lettura. La specifica HTML5 non definisce l'aspetto del campo e del testo in questi stati, quindi i browser lo visualizzano in modo diverso (Figura 2).
musica lirica | |
Il testo all'interno di un campo bloccato non può essere selezionato e aggiunto e il contenuto di tale campo non viene inviato dal modulo al server. Il testo all'interno del campo di lettura può essere copiato, ma non può essere modificato. L'esempio 2 mostra come creare un campo di lettura.
Esempio 2: Campo di lettura
HTML5 IE Cr Op Sa Fx
Copia il testo qui sotto e incollalo nel campo di richiesta password.
Tieni presente che il campo di lettura non è diverso nell'aspetto da un normale campo di testo, ma l'utente non potrà aggiungervi nulla. Quindi usalo con attenzione per evitare di ingannare le persone.