Tag DIV sono il metodo principale di portare i fogli di stile CSS (CSS) nel codice HTML. Prima del CSS, gli sviluppatori Web utilizzato goffi cornici e tabelle complesse per organizzare il layout del proprio sito. Non solo era questo ingombrante, ma ha lasciato confuso e difficile da modificare il codice nella sua scia. I tag DIV, in sostanza, creare un blocco di codice (come caselle di testo in un layout di pagina). L'ascesa del CSS ha permesso agli sviluppatori di più facilmente organizzano le informazioni all'interno del loro sito. Tag DIV sono il ponte tra CSS e HTML, portando quel codice CSS nelle pagine effettive.
Istruzioni
Definendo gli attributi
1
Individuare la posizione nel codice dove si desidera inserire il tag DIV. Questo è di solito all'interno del corpo del codice. Digitare quanto segue in tale posizione:
< div >< / div >
2
Definire la classe (facoltativo; per uso con stili CSS predefiniti) digitando quanto segue dietro il primo "div", dove "X" è il nome della classe:
classe = "X".
Essa sarà simile a questo:
< div class = "NomeClasse" >< / div >.
3
Definire l'identità (facoltativo; deve essere univoco per questo particolare DIV) digitando quanto segue dietro il primo "div", dove "X" è l'ID univoco:
ID = X
Essa sarà simile a questo:
< div id = "yourid" >< / div >.
4
Impostare la direzione del testo (opzionale) digitando quanto segue dietro il primo "div", dove "X" può essere "rtl" (right-to-left) o "ltr" (da sinistra a destra):
dir = "X"
Essa sarà simile a questo:
< div dir = "rtl" >< / div >.
5
Impostare la lingua (opzionale) digitando quanto segue dietro il primo "div", dove "X" è il codice di linguaggio specifico (ad esempio, "en" per l'inglese) o "es" per lo spagnolo:
lang = "X"
Essa sarà simile a questo:
< div lang = "it" >< / div >.
6
Impostare il linguaggio XHTML (facoltativo; solo per i documenti XHTML) digitando quanto segue dietro il primo "div", dove "X" è il codice di linguaggio specifico (ad esempio, "en" per l'inglese) o "es" per lo spagnolo:
XML: lang = "X"
Essa sarà simile a questo:
< div XML: lang = "it" >< / div >.
7
Specificare un titolo (facoltativo; per aggiunta Descrizione del DIV) digitando quanto segue dietro il primo "div", dove "X" è un breve titolo per quel DIV:
titolo = "X"
Essa sarà simile a questo:
< div titolo = "yourtitle" >< / div >.
8
Applicare gli attributi CSS direttamente il DIV (opzionale) digitando quanto segue dietro il primo "div", dove "X" è una serie di codici CSS, ciascuno seguito da un punto e virgola e uno spazio:
stile = "X"
Essa sarà simile a questo:
< div style = "text-align: right; background-color: white; " >< / div >.
Definire gli eventi
9
Impostare l'evento per mouse click (opzionale), digitando uno dei seguenti dietro il primo "div", dove "X" è il tuo script, "onclick" è un singolo clic, "ondblclick" è un doppio clic, "onmousedown" è premuto un pulsante del mouse e "onmouseup" è un rilascio del pulsante del mouse:
OnClick = "X"
ondblclick = "X"
OnMouseDown = "X"
OnMouseUp = "X"
Essa sarà simile a questo:
< div onclick = "yourscript" >< / div >
10
Impostare l'evento per gli effetti di rollover del mouse (opzionale), digitando uno dei seguenti dietro il primo "div", dove "X" è il tuo script, "onmouseover" è quando il mouse passa il DIV e "onmouseout" è quando il mouse lascia l'elemento DIV:
onmouseover = "X"
onmouseout = "X"
Essa sarà simile a questo:
< div onmouseover = "yourscript" >< / div >
11
Impostare l'evento per fa clic tastiera (opzionale), digitando uno dei seguenti dietro il primo "div", dove "X" è il tuo script, "onkeydown" è quando viene premuto un tasto, "onkeyup" quando viene rilasciato un tasto, e "onkeypress" è quando un tasto viene premuto e rilasciato:
OnKeyDown = "X"
OnKeyUp = "X"
OnKeyPress = "X"
Essa sarà simile a questo:
< div onkeydown = "yourscript" >< / div > o < div onkeyup = "yourscript" >< / div > o < div onkeypress = "yourscript" >< / div >.
Consigli & Avvertenze
- Il miglior uso dei tag DIV è in relazione con un file CSS master, quindi assicuratevi di leggere su CSS per massimizzare l'utilizzo di questi tag.
- Assicurarsi di testare il vostro div in diversi browser per assicurarsi che funzionino correttamente. Non tutti i browser delizia codice lo stesso o sono compatibili con gli standard HTML correnti.
- HTML e CSS sono in costante crescita lingue. Tag andare fuori uso e non può cessare di essere supportati (definita come "deprecato"). I tag utilizzati in questo articolo sono aggiornati al giugno 2011, ma potrebbero cambiare in futuro.