Hvordan skrive DIV tagger

March 6

DIV-koder er den primære metoden for å bringe Cascading Style Sheets (CSS) inn i HTML-koden. Før CSS, webutviklere brukt klumpete rammer og komplekse tabeller til å organisere oppsettet av deres nettsted. Ikke bare var dette tungvint, men det igjen forvirrende og vanskelig å redigere koden i dens kjølvann. DIV-koder egentlig lage en blokk med kode (som tekstbokser i en sidelayout). Framveksten av CSS har tillatt utviklere å lettere organisere informasjon innenfor sitt område. DIV-koder er broen mellom CSS og HTML, bringe den CSS-kode inn i selve sidene.

Bruksanvisning

Definere attributter

1 Finn stedet i koden der du ønsker å sette inn DIV tag. Dette er vanligvis i kroppen av koden. Skriv inn følgende i denne plasseringen:

2 Definer klassen (valgfritt, for bruk med forhåndsdefinerte CSS-stiler) ved å skrive følgende bak den første "div", der "X" er navnet på klassen:

class = "X".

Det vil se slik ut:

<Div class = "yourclassname"> </ div>.

3 Definer identitet (valgfritt, må være unikt for denne DIV) ved å skrive følgende bak den første "div", der "X" er den unike ID:

id = X

Det vil se slik ut:

<Div id = "yourid"> </ div>.

4 Angi tekstretning (valgfritt) ved å skrive følgende bak den første "div", der "X" kan være enten "RTL" (fra høyre mot venstre) eller "ltr" (venstre mot høyre):

dir = "X"

Det vil se slik ut:

<Div dir = "RTL"> </ div>.

5 Angi språket (valgfritt) ved å skrive følgende bak den første "div", der "X" er den spesifikke språkkoden (for eksempel "no" for engelsk eller "es" for spansk):

lang = "X"

Det vil se slik ut:

<Div lang = "no"> </ div>.

6 Sett XHTML språk (valgfritt, bare for XHTML-dokumenter) ved å skrive følgende bak den første "div", der "X" er den spesifikke språkkoden (for eksempel "no" for engelsk eller "es" for spansk):

xml: lang = "X"

Det vil se slik ut:

<Div xml: lang = "no"> </ div>.

7 Angi en tittel (valgfritt, for ekstra beskrivelse av DIV) ved å skrive følgende bak den første "div", der "X" er en kort tittel for at DIV:

title = "X"

Det vil se slik ut:

<Div title = "yourtitle"> </ div>.

8 Påfør en CSS attributter direkte til DIV (valgfritt) ved å skrive følgende bak den første "div", der "X" er en serie med CSS koder, hver etterfulgt av et semikolon og en plass:

style = "X"

Det vil se slik ut:

<Div style = "text-align: right; background-color: white;"> </ div>.

Definere Hendelser

9 Angi aktiviteten for museklikk (valgfritt) ved å skrive ett av følgende bak den første "div", der "X" er skriptet, "onclick" er et enkelt klikk, "ondblclick" er et dobbeltklikk, "onmousedown" er en museknapp trykk og "onmouseup" er en museknapp utgivelse:

onclick = "X"

ondblclick = "X"

onmousedown = "X"

onmouseup = "X"

Det vil se slik ut:

10 Sett tilfelle for mus rollover effekter (valgfritt) ved å skrive ett av følgende bak den første "div", der "X" er skriptet, "onmouseover" er når musen går på DIV og "onmouseout" er når muse forlater DIV:

onmouseover = "X"

onmouseout = "X"

Det vil se slik ut:

11 Angi aktiviteten for tastaturklikk (valgfritt) ved å skrive ett av følgende bak den første "div", der "X" er skriptet, "onkeydown" er når en tast blir trykket, "onkeyup" er når en tast er utgitt, og "onkeypress" er når en tast trykkes og deretter løslatt:

onkeydown = "X"

onkeyup = "X"

onkeypress = "X"

Det vil se slik ut:

<Div onkeydown = "yourscript"> </ div> eller <div onkeyup = "yourscript"> </ div> eller <div onkeypress = "yourscript"> </ div>.

Hint

Den beste bruk av DIV-koder er i forbindelse med en master CSS-fil, så pass på å lese opp på CSS for å maksimere bruken av disse kodene.
Husk å teste dine divs i flere forskjellige nettlesere for å sikre at de fungerer som de skal. Ikke alle nettlesere behandle koden den samme eller er kompatible med dagens HTML-standarder.
HTML og CSS er stadig økende språk. Tags går ut av bruk og kan opphøre å bli støttet (referert til som "foreldet"). Kodene som brukes i denne artikkelen er oppdatert per juni 2011, men kan endre seg i fremtiden.