Salve a tutti, ho visto molte guide postate qui sull' HTML, e devo dire che fanno veramente pena.
C'è chi dice che un commento che si crea in PHP venga utilizzato anche in HTML, chi ti spiega come scaricare un editor HTML visuale e non ti spiega come utilizzarlo, chi ti spiega come creare una pagina HTML come un professionista ma non inserisce nemmeno i tag principali.
Innanzitutto, cos'è il linguaggio HTML?
L' HTML (HyperText Markup Language) è un linguaggio utilizzato per creare pagine statiche, non è proprio un linguaggio di programmazione, ma più di scripting (cos'è uno script? è una serie di istruzioni testuali che vengono interpretate da un browser web).
Le sue funzioni vengono scritte con appositi tag chiamati anche marcatori.
Un esempio di marcatore può essere questo:
Che indica al browser che stiamo aprendo una pagina html.
Un consiglio prima di iniziare la pratica è di scaricare un editor HTML, io consiglio vivamente CodeLobster PHP Edition che supporta vari linguaggi di programmazione.
L' editor è reperibile all' indirizzo
Ora che abbiamo visto un pò di teoria passiamo alla pratica.
Prima ancora di dichiarare l' apertura del linguaggio è bene inserire questo doctype:
Ma cos'è esattamente un doctype? è una stringa che indica quale linguaggio stiamo utilizzando (HTML, XHTML, XML etc.) e in quale lingua viene creato (Inglese, francesce, tedesco etc.).
Ora che abbiamo inserito il doctype diciamo al browser che stiamo aprendo una pagina HTML con i seguenti tag:
Tutto il contenuto della pagina HTML andrà inserito dentro questi due tag.
Ora elencheremo i tag più importanti e ne descriveremo le funzionalità.
• <head>
• <body>
<head>, dall' inglese testa, indica alla pagina che il contenuto di questo tag sarà la "testa" della pagina, qui potremo inserire script js (javascript), un titolo per la pagina e documenti CSS.
<body>, dall' inglese corpo, indica alla pagina che il contenuto di questo tag sarà il "corpo della pagina, qui invece inseriremo tutto il codice che non verrà inserito nella testa (background, textbox, radio button etc.).
Abbiamo detto che nella testa possiamo inserire degli script js e documenti CSS, ma questi li tralascio poiché li inserirò in un' apposita guida.
Invece vediamo come inserire il titolo della pagina:
<title> Titolo della pagina </title>
Dove c'è scritto "titolo della pagina" noi scriveremo il titolo per la nostra pagina, esempio: pincopallino.
Ora vediamo alcune funzioni che andremo a inserire nel corpo.
Una delle funzioni più utilizzate sono certamente quelle relative al background della pagina, ma cos'è un background e come può essere creato? Un background è lo sfondo della pagina, e può essere creato sia con marcatori HTML sia con documenti CSS.
Noi vedremo come crearlo con marcatori HTML.
Innanzitutto dovremo avere l' immagine da inserire come background, poi andremo nel corpo della pagina e scriveremo:
Al posto di nome_del_file inseriremo il nome dell' immagine (esempio: bobba), invece al posto di estensione_del_file inseriremo l' estensione della nostra immagine (esempio: jpg, gif, png).
Ricorda: l' immagine deve sempre trovarsi nella stessa directory dove si trova la pagina html.
Se invece vogliamo che il background sia di un unico colore ma non vogliamo creare un' immagine possiamo usufruire dell' utilissimo tag:
bgcolor sta a significare background color (colore del background), al posto di nome_colore_in_inglese inseriremo un qualsiasi colore scritto in lingua inglese, esempio yellow, black, purple etc.
Ora passiamo all' inserimento e alla formattazione del testo.
Per inserire un qualsiasi testo divisibile in sei grandezze inseriremo uno di questi sei tag:
H1 sarà un tag con una scrittura molto grande, adatta a un bel titolone, via via andando il testo diventerà sempre più piccolo.
Se invece vogliamo fare tutto insieme (inserire testo in una grandezza specifica, decidere il colore del testo, formattare il testo con un font personalizzato) possiamo utilizzare semplicemente il tag font:
Al posto di grandezza_da_1_a_6 inseriremo la grandezza del testo (più il numero sarà alto e più il testo sarà grande), al posto di colore_in_inglese il nome del colore desiderato scritto in inglese e al posto di nome_del_font il nome del font desiderato (esempio: Raavi, Times New Roman, Arial).
Continuiamo con la formattazione del testo, ora elencherò un paio di funzioni, che spiegherò una a una.
• <li>
• <b>
• <br>
• <i>
• <u>
• <big>
• <small>
Queste sono le funzioni principali, il tag <li> serve per creare un pallino (questo: •), <b> per scrivere testo in grassetto, <br> per andare a capo, <i> per scrivere in corsivo, <u> per scrivere sottolineato, <big> per scrivere in grande e <small> per scrivere un piccolo.
Non ho spiegato questi marcatori come gli altri poiché non hanno spiegazioni.
Ora vedremo come:
• Inserire un' immagine
• Far muovere un testo
Per inserire un' immagine nella pagina si utilizza il tag
Il funzionamento è lo stesso del body background, a differenza che qui inserirà l' immagine una sola volta e li fino a coprire tutta la pagina.
Possiamo spostare l' immagine a sinistra, al centro o a destra con questi appositi tag:
Ora che abbiamo visto come inserire un' immagine e spostarla all' interno della pagina vedremo come far sì che un testo si muova da destra verso sinistra, per fare ciò useremo il tag
Al posto di "testo che si muoverà" inseriremo il testo che vogliamo si muova da destra verso sinistra nella pagina.
Per finire vedremo come inserire i form.
Innanzitutto per far sì che i form facciano qualcosa concreto bisogna richiamare e utilizzare anche una pagina in PHP, la quale non vedremo in questo momento, ma farò una guida relativa a questo linguaggio.
Come abbiamo detto dobbiamo richiamare una pagina PHP, quindi inseriremo il marcatore:
All' interno di questo marcatore inseriremo tutti i form.
Ecco alcuni form molto utili:
Ovviamente i form non sono completi, mancano le informazioni che andranno inviate al file PHP, inutile inserirle senza il file.
Come avrete notato questi marcatori si chiudono con /> e non hanno il tag di chiusura </input> come quasi tutti gli altri tag (</div>, </body>, </html> etc.).
Infatti questi sono tag speciali e non ne hanno bisogno.
Ora sapete principalmente cos'è e come si utilizza l' HTML!
Spero che la guida sia stata di vostro gradimento.
Fonti: tutto il malloppo è stato scritto da me e non copiato da altri forum/siti.
è permessa la riproduzione a patto che mi venga prima chiesto.
C'è chi dice che un commento che si crea in PHP venga utilizzato anche in HTML, chi ti spiega come scaricare un editor HTML visuale e non ti spiega come utilizzarlo, chi ti spiega come creare una pagina HTML come un professionista ma non inserisce nemmeno i tag principali.
Innanzitutto, cos'è il linguaggio HTML?
L' HTML (HyperText Markup Language) è un linguaggio utilizzato per creare pagine statiche, non è proprio un linguaggio di programmazione, ma più di scripting (cos'è uno script? è una serie di istruzioni testuali che vengono interpretate da un browser web).
Le sue funzioni vengono scritte con appositi tag chiamati anche marcatori.
Un esempio di marcatore può essere questo:
Codice:
Perfavore,
Entra
oppure
Registrati
per vedere i codici!
Un consiglio prima di iniziare la pratica è di scaricare un editor HTML, io consiglio vivamente CodeLobster PHP Edition che supporta vari linguaggi di programmazione.
L' editor è reperibile all' indirizzo
Perfavore,
Entra
oppure
Registrati
per vedere i Link!
ed è disponibile solo in lingua inglese.Ora che abbiamo visto un pò di teoria passiamo alla pratica.
Prima ancora di dichiarare l' apertura del linguaggio è bene inserire questo doctype:
Codice:
Perfavore,
Entra
oppure
Registrati
per vedere i codici!
Ora che abbiamo inserito il doctype diciamo al browser che stiamo aprendo una pagina HTML con i seguenti tag:
Codice:
Perfavore,
Entra
oppure
Registrati
per vedere i codici!
Ora elencheremo i tag più importanti e ne descriveremo le funzionalità.
• <head>
• <body>
<head>, dall' inglese testa, indica alla pagina che il contenuto di questo tag sarà la "testa" della pagina, qui potremo inserire script js (javascript), un titolo per la pagina e documenti CSS.
<body>, dall' inglese corpo, indica alla pagina che il contenuto di questo tag sarà il "corpo della pagina, qui invece inseriremo tutto il codice che non verrà inserito nella testa (background, textbox, radio button etc.).
Abbiamo detto che nella testa possiamo inserire degli script js e documenti CSS, ma questi li tralascio poiché li inserirò in un' apposita guida.
Invece vediamo come inserire il titolo della pagina:
<title> Titolo della pagina </title>
Dove c'è scritto "titolo della pagina" noi scriveremo il titolo per la nostra pagina, esempio: pincopallino.
Ora vediamo alcune funzioni che andremo a inserire nel corpo.
Una delle funzioni più utilizzate sono certamente quelle relative al background della pagina, ma cos'è un background e come può essere creato? Un background è lo sfondo della pagina, e può essere creato sia con marcatori HTML sia con documenti CSS.
Noi vedremo come crearlo con marcatori HTML.
Innanzitutto dovremo avere l' immagine da inserire come background, poi andremo nel corpo della pagina e scriveremo:
Codice:
Perfavore,
Entra
oppure
Registrati
per vedere i codici!
Ricorda: l' immagine deve sempre trovarsi nella stessa directory dove si trova la pagina html.
Se invece vogliamo che il background sia di un unico colore ma non vogliamo creare un' immagine possiamo usufruire dell' utilissimo tag:
Codice:
Perfavore,
Entra
oppure
Registrati
per vedere i codici!
Ora passiamo all' inserimento e alla formattazione del testo.
Per inserire un qualsiasi testo divisibile in sei grandezze inseriremo uno di questi sei tag:
Codice:
Perfavore,
Entra
oppure
Registrati
per vedere i codici!
Se invece vogliamo fare tutto insieme (inserire testo in una grandezza specifica, decidere il colore del testo, formattare il testo con un font personalizzato) possiamo utilizzare semplicemente il tag font:
Codice:
Perfavore,
Entra
oppure
Registrati
per vedere i codici!
Continuiamo con la formattazione del testo, ora elencherò un paio di funzioni, che spiegherò una a una.
• <li>
• <b>
• <br>
• <i>
• <u>
• <big>
• <small>
Queste sono le funzioni principali, il tag <li> serve per creare un pallino (questo: •), <b> per scrivere testo in grassetto, <br> per andare a capo, <i> per scrivere in corsivo, <u> per scrivere sottolineato, <big> per scrivere in grande e <small> per scrivere un piccolo.
Non ho spiegato questi marcatori come gli altri poiché non hanno spiegazioni.
Ora vedremo come:
• Inserire un' immagine
• Far muovere un testo
Per inserire un' immagine nella pagina si utilizza il tag
Codice:
Perfavore,
Entra
oppure
Registrati
per vedere i codici!
Possiamo spostare l' immagine a sinistra, al centro o a destra con questi appositi tag:
Codice:
Perfavore,
Entra
oppure
Registrati
per vedere i codici!
Codice:
Perfavore,
Entra
oppure
Registrati
per vedere i codici!
Per finire vedremo come inserire i form.
Innanzitutto per far sì che i form facciano qualcosa concreto bisogna richiamare e utilizzare anche una pagina in PHP, la quale non vedremo in questo momento, ma farò una guida relativa a questo linguaggio.
Come abbiamo detto dobbiamo richiamare una pagina PHP, quindi inseriremo il marcatore:
Codice:
Perfavore,
Entra
oppure
Registrati
per vedere i codici!
Ecco alcuni form molto utili:
Codice:
Perfavore,
Entra
oppure
Registrati
per vedere i codici!
Come avrete notato questi marcatori si chiudono con /> e non hanno il tag di chiusura </input> come quasi tutti gli altri tag (</div>, </body>, </html> etc.).
Infatti questi sono tag speciali e non ne hanno bisogno.
Ora sapete principalmente cos'è e come si utilizza l' HTML!
Spero che la guida sia stata di vostro gradimento.
Fonti: tutto il malloppo è stato scritto da me e non copiato da altri forum/siti.
è permessa la riproduzione a patto che mi venga prima chiesto.
