Oversikt over HTML5 nye elementer
Siden 1999, da HTML 4.01 ble en standard, har nettet og bruken av nettet endret et betydelig tiltak. W3C har bestemt seg for å endre den grunnleggende HTML-syntaks fra Standard Generalised Markup Language (SGML) til XML, og også helt forskjellige markeringsspråk som Scalable Vector Graphics (SVG), XForms og MathML. Foreløpig er noen HTML 4.01-komponenter utdaterte, aldri brukt eller ikke brukt som forventet. Hver del av komponentene i HTML5 fortrenges eller komponeres på nytt. HTML5 har inkludert nye elementer for å illustrere representasjon, visning av digitalt innhold, forbedret sideoppsett og generell funksjonalitet, og flere nye grensesnitt for å takle dagens krav på internett.
Det er flere nye elementer introdusert i HTML5, som tilbyr visse tilleggsfunksjoner for å utvikle et ønskelig og interaktivt nettsted. Vi kan opprette koden din raskt og effektivt ved hjelp av slike komponenter. På grunn av mangelen på struktur er mange velformede HTML-dokumenter vanskeligere å håndtere enn de trenger å være. Gjennom å evaluere toppskalaer må vi finne ut hvor segmentbruddene er på vei. Div-elementet identifiserer sidefelt, bunntekst, topptekst, navigasjonsmenyer og hovedinnhold.
Topp 10 nye HTML5-elementer
HTML5 gir nye elementer for å forbedre utformingen av dokumentet.
1.
Elementet spesifiserer en del av en side som inkluderer en egen struktur i et dokument, seksjon eller nettsted og som anbefales å være distribuert eller brukbar. Dette kan være en gruppe som poster en journal eller en daglig papirrapport, en innsending til et online nyhetsbrev, en merknad sendt av en kunde eller et hvilket som helst annet stofffritt objekt.
Eksempel:
Article Element
EDUCBA
EDUCBA (Corporate Bridge Consultancy Pvt Ltd) is a leading global provider of skill based education addressing the needs 500, 000+ members across 40+ Countries.
Article Element
EDUCBA
EDUCBA (Corporate Bridge Consultancy Pvt Ltd) is a leading global provider of skill based education addressing the needs 500, 000+ members across 40+ Countries.
Article Element
EDUCBA
EDUCBA (Corporate Bridge Consultancy Pvt Ltd) is a leading global provider of skill based education addressing the needs 500, 000+ members across 40+ Countries.
Article Element
EDUCBA
EDUCBA (Corporate Bridge Consultancy Pvt Ltd) is a leading global provider of skill based education addressing the needs 500, 000+ members across 40+ Countries.
Article Element
EDUCBA
EDUCBA (Corporate Bridge Consultancy Pvt Ltd) is a leading global provider of skill based education addressing the needs 500, 000+ members across 40+ Countries.
Article Element
EDUCBA
EDUCBA (Corporate Bridge Consultancy Pvt Ltd) is a leading global provider of skill based education addressing the needs 500, 000+ members across 40+ Countries.
Produksjon:
- Lagre koden ovenfor i en fil med .html-utvidelse.
- Kjør html-filen i en nettleser, så får du utdataene som vist i bildet nedenfor.
2.
Elementet indikerer individuelt innhold på mye måte som kategoriseringer, kart, bilder, kodeartikler og mange flere.
Eksempel:
Figure Element
EDUCBA er en ledende global leverandør av ferdighetsbasert utdanning som imøtekommer behovene 500 000+ medlemmer over 40+ land.
Produksjon:
Koden ovenfor vil produsere utdataene som vist i bildet nedenfor,
3.
Elementet brukes til å legge til beskrivelse for bildet.
Eksempel:
Figure Caption Element
EDUCBA er en ledende global leverandør av ferdighetsbasert utdanning som imøtekommer behovene 500 000+ medlemmer over 40+ land.
EDUCBA (Corporate Bridge Consultancy Pvt Ltd)
Produksjon:
Koden ovenfor viser resultatet som vist på bildet nedenfor,
4.
Elementet brukes til å spesifisere overskriften for et dokument eller et avsnitt på siden. Du kan definere mer enn en overskrift i et enkelt dokument.
Eksempel:
Header Element
Header One
Header Two
Header Three
Header Element
Header One
Header Two
Header Three
Header Element
Header One
Header Two
Header Three
Header Element
Header One
Header Two
Header Three
Header Element
Header One
Header Two
Header Three
Header Element
Header One
Header Two
Header Three
Header Element
Header One
Header Two
Header Three
Header Element
Header One
Header Two
Header Three
Header Element
Header One
Header Two
Header Three
Header Element
Header One
Header Two
Header Three
Innholdet i dokumentet går her …
Produksjon:
Koden ovenfor viser resultatet som vist på bildet nedenfor,
5.
Elementet brukes til å spesifisere informasjonen som forfatterinformasjon, opphavsrettsinformasjon, kontakt, koblinger til relaterte dokumenter, nettstedskart og mange flere.
Eksempel:
Footer Element
Copyright © 2019 www.educba.com
Kontakt:
Produksjon:
Koden ovenfor viser resultatet som vist på bildet nedenfor,
6.
Elementet brukes til å vise den viktigste informasjonen i et dokument.
Eksempel:
Main Element
Informasjon om topptekst
Hovedinformasjon
EDUCBA
EDUCBA er en ledende global leverandør av ferdighetsbasert utdanning …
Bunntekstinformasjon
Produksjon:
Koden ovenfor vil produsere utdataene som vist i bildet nedenfor,
7.
Elementet brukes til å fremheve eller markere teksten med bakgrunnsfargen som tiltrekker brukeren for en bestemt tekst på dokumentet.
Eksempel:
Mark Element
EDUCBA er en ledende global leverandør av ferdighetsbasert utdanning som imøtekommer behovene 500 000+ medlemmer over 40+ land.
Produksjon:
Koden ovenfor viser resultatet som vist på bildet nedenfor,
8.
Elementet brukes til å spesifisere navigasjonslenker på siden. Disse koblingene gir tilkoblinger til andre sider i et dokument.
Eksempel:
Nav Element
HTML |
CSS |
JAVA |
PHP |
PYTHON
Produksjon:
Koden ovenfor vil produsere utdataene som vist i bildet nedenfor,
9.
Elementet brukes til å definere den frittstående delen eller den spesifikke regionen i dokumentet.
Eksempel:
Section Element
Main Article
Section Element
Main Article
Section Element
Main Article
Innholdet i hovedoverskriften vises her …
Avsnitt én
Innholdet i den første delen vises …
Avsnitt to
Innholdet i den andre delen vises …
Produksjon:
Koden ovenfor viser resultatet som vist på bildet nedenfor,
10.
Taggen er et underdel av taggen som inneholder teksten som kan vises eller skjules når brukeren klikker på overskriften.
Eksempel:
Summary Element
EDUCBA - Corporate Bridge Consultancy Pvt Ltd
Det er en ledende global leverandør av ferdighetsbasert utdanning som imøtekommer behovene 500 000+ medlemmer over 40+ land.
Produksjon:
Når du kjører koden ovenfor, vil den vise resultatet som vist nedenfor,
Som vist på bildet, klikk på overskriften, den vil vise skjult tekst som vist i bildet nedenfor,
Konklusjon
Så langt har vi sett hvordan nye HTML5-elementer er nyttige for forskjellige oppgaver i etableringen av nettstedet. Disse nye elementene leser dokumentet på en mer nøyaktig og opp til standard måte og utvikler mer komplekse og effektive webapper. De nye HTML5-elementene gir noen ekstra ekstrafunksjoner for å generere interaktive nettsteder.
Anbefalte artikler
Dette er en guide til Html5 nye elementer. Her diskuterer vi de 10 nye elementene i Html5 for å forbedre utformingen av dokumentet. Du kan også se på følgende artikler for å lære mer -
- Fargekorrigering i After Effects
- Topp 6 versjoner av HTML
- Html5 vs Html4
- XHTML vs HTML5
- Hva er Bridge?
- HTML5 Tagger | Topp 4 tagger med HTML5