Mange som er nye for webdesign og HTML / CSS bruker og Div-elementet definerer logiske divisjoner på websiden din. Det er i utgangspunktet en boks der du kan plassere andre HTML-elementer som logisk går sammen. En divisjon kan ha flere andre elementer i den, som avsnitt, overskrifter, lister, lenker, bilder etc. Det kan til og med ha andre divisjoner inne i det for å gi ytterligere struktur og organisasjon til HTML-dokumentet ditt. For å bruke div elementet, legg en åpen id = "myDiv">
), eller en klassevelger (f.eks. class = "bigDiv"> Div-elementet er forskjellig fra HTML5-seksjonselementet fordi det ikke gir det vedlagte innhold noen semantisk betydning. Hvis du ikke er sikker på om innholdsblokken skal være en div eller en seksjon, tenk på hva formålet med elementet og innholdet er å hjelpe deg med å bestemme hva du skal bruke: Til slutt oppfører begge divs og seksjoner seg ganske likt, og du kan gi noen av dem attributtverdier og stil dem med CSS for å få utseendet til nettstedet du trenger. Begge disse er blokknivåelementer. Spenningselementet er som standard et inlineelement. Dette skiller det fra div og delelementene. Spenningselementet brukes ofte til å pakke inn et bestemt innhold, normalt tekst, for å gi den en ekstra "krok" som kan styles senere. Brukes med CSS, det kan endre stilen på teksten den omslutter; Men uten noen stilattributter har spanningselementet i seg selv ingen effekt på tekst i det hele tatt. Dette er hovedforskjellen mellom span og div-elementene. Som nevnt ovenfor inkluderer div-elementet en paragrafspredning, mens spanningselementet bare forteller nettleseren å anvende tilknyttede CSS-stilregler til det som er vedlagt av tags: Uthevet tekst og ikke-fremhevet tekst. Legg til class = "highlight"
eller annen klasse til spanelementet for å stile teksten med CSS (f.eks. class = "highlight">
). Spenningselementet har ingen nødvendige egenskaper, men de tre som er mest nyttige, er de samme som div-elementets: Bruk span når du vil endre innholdsstilen uten å definere innholdet som et nytt blokknivåelement i dokumentet. For eksempel, hvis du vil at det andre ordet i en h3-overskrift skal være rødt, kan du omgjøre det ordet med et spenningselement som vil stile det ordet som rød tekst. Ordet forblir fortsatt en del av h3-elementet, men vises nå også i rødt: Bruker
). Begge disse egenskapene kan deretter velges ved hjelp av CSS eller endret ved hjelp av JavaScript. Nåværende beste praksis lytter seg mot å bruke klassevalgere i stedet for IDer, delvis på grunn av hvordan bestemte ID-selektorer er. I sannhet kan du imidlertid bruke enten en og kan til og med gi en oppdeling både en ID og en klasseväljare. Når du skal bruke
Bruker Element
Dette er min fantastiske overskrift
elementer i utveksling som de bygger ut nettsider. Virkeligheten er imidlertid at hver av disse HTML-elementene tjener forskjellige formål. Lære å bruke hver for det tiltenkte formål, vil hjelpe deg med å utvikle renere nettsider som kode er enklere å administrere overordnet.
Element
tag før området på siden du vil ha som en egen divisjon, og en lukk
merk etter det:
innhold av div
Hvis området på siden din trenger noen tilleggsinformasjon som du vil bruke til å style med CSS senere, kan du legge til en idvelger (f.eks.
Mot
