Costruire un sito Web 2 – HTML – Parte 2

HTML

Come annunciato nell’articolo precedente parliamo di Form e Tabelle.

Form

Il form è una pagina dove l’utente può interagire, dando o chiedendo delle informazioni. Es. quando dobbiamo accedere in un sito web dobbiamo inserire le nostri credenziali, Username e Password.

Si utilizza il tag <input> e per dargli una tipologia di dati, che vanno inseriti si utilizza l’attributo type. Nell’esempio utilizzo il type=”text” per definire che sarà un imput di tipo testo, mentre nella linea sotto utilizzo il type=”password”. In questo modo quando digitalizzo la password si vedranno dei punti al posto dei carattere premuti. Nella terza linea utilizzo il type=”checkbox” per dare all’utente una scelta, in questo caso se rimanere loggato o no. Infine col type=”submit” si crea un pulsante per la conferma della fine dell’inserimento del form. Trovate anche l’attributo placeholder che è praticamente un segnaposto. Quando si andrà a inserire Username o Password la scritta sparirà e riapparirà quando il form è vuoto. Mentre l’attributo value si utilizza per cambiare la scritta sul pulsante. La scritta di defult è Submit o Invia a seconda della lingua che utilizzate, inglese o italiano.

Abbiamo l’attributo radio. Che viene utilizzato per far fare una scelta tra molte opzione.

Qui troviamo due nuovi attributi. Name e values. Name serve per poter “legare” le scelte. Per far questo gli diamo lo stesso nome. Cosi facendo l’utente dovrà scegliere tra le due opzioni. Se non avessimo utilizzato l’attributo name l’operatore avrebbe potuto scegliere tutte e due le opzione. Values serve per dare un valore alla scelta che si fa. Perciò se si sceglie, Ho più di 18 anni, avremo come valore di ritorno “a18”. Comunque per la gestione values si vedrà più avanti.

Infine nel form potremo creare una scelta a tendina.

Si utilizza il tag <select> </select> e il tag <option></option> per definire le opzioni di scelta.

 

 

 

Se volete approfondire gli attributi del tag <input> potete cliccare qui.

 

Le Tabelle                                                                                                                                                                                  

 

 

 

 

Le tabelle servono per mostrare in modo ordinato dei dati, (tipo excel). Tutto quello che si trova tra il tag <table>….</table> fa parte della tabella. Per il titolo si utilizza <thead></thead>.  Come si vede nell’esempio si procede con <tr></tr> al suo interno il titolo con <th>Cognome</th>. Se il titolo fosse composto da più parola si utilizza <br> per andare a capo. es. <th>Numero<br>civico</th>.

Mentre il corpo dei dati della tabella deve essere all’interno del tag <tbody></tbody>. Ogni linea di dato sta all’interno di <tr></tr> per poi ogni campo all’interno del tag <td>Rossi</td>.

 

 

 

 

 

Inserire contenuti di altri siti web nella tua pagina

Se si volesse inserire per esempio un video di Youtube o altre pagine web, si utilizza il tag <iframe></iframe>. Si possono dare le dimensione di quello che volete includere. Se volessi includere la pagina di Wikipedia scriverei : <iframe width=”560″ height=”315″ src=”https://it.wikipedia.org/wiki/Pagina_principale” frameborder=”0″ </iframe> . Nell’esempio trovo degli attributi width che è la lunghezza in pixel mentre height è l’altezza. Abbiamo src= dove si inserisce l’Url. Mentre frameborder serve per mettere o meno il bordo, i valori sono 0 (zero) e 1.

Nella prossima parte comincerò a parlare di CSS

Se volete approfondire meglio HTML potete cercare su internet.

 

 

Torna su