Oversigt over HTML5 nye elementer
Siden 1999, da HTML 4.01 blev en standard, har internettet og brugen af internettet ændret sig en væsentlig foranstaltning. W3C har besluttet at ændre den grundlæggende HTML-syntaks fra Standard Generalised Markup Language (SGML) til XML, og også helt forskellige markup-sprog såsom Scalable Vector Graphics (SVG), XForms og MathML. I øjeblikket er nogle HTML 4.01-komponenter forældede, aldrig brugt eller ikke brugt som forventet. Hver del af komponenterne i HTML5 forskydes eller komponeres igen. HTML5 har inkluderet nye elementer til illustrering af repræsentation, visning af digitalt indhold, forbedret sidelayout og overordnet funktionalitet og flere nye grænseflader til korrekt at tackle dagens internetkrav.
Der er flere nye elementer introduceret i HTML5, der tilbyder visse yderligere funktioner til at udvikle et ønskeligt og interaktivt sted. Vi kan oprette din kode hurtigt og effektivt ved hjælp af sådanne komponenter. På grund af den manglende struktur er mange velformede HTML-dokumenter sværere at håndtere, end de har brug for. Gennem evaluering af overskudsskalaer er vi nødt til at finde ud af, hvor segmentopdelingen er på vej. Div-elementet identificerer sidebjælker, sidefødder, overskrifter, navigationsmenuer og dele af hovedindhold.
Top 10 nye HTML5-elementer
HTML5 giver nye elementer til forbedring af dokumentets layout.
1.
Elementet specificerer en del af en side, der inkluderer en separat struktur i et dokument, sektion eller websted, og som anbefales at blive bredt distribueret eller anvendelig. Dette kan være en gruppe, der poster en journal eller en daglig papirrapport, en indsendelse til et online nyhedsbrev, en bemærkning sendt af en kunde eller ethvert andet stoffrit 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.
Produktion:
- Gem ovenstående kode i en fil med .html-udvidelse.
- Kør html-filen i en browser, så får du output som vist på nedenstående billede.
2.
Elementet angiver individuelt indhold på meget måde som kategoriseringer, kort, billeder, kodeartikler og mange flere.
Eksempel:
Figure Element
EDUCBA er en førende global leverandør af kvalitetsbaseret uddannelse, der imødekommer behovene 500.000+ medlemmer i 40+ lande.
Produktion:
Ovenstående kode producerer output som vist på nedenstående billede,
3.
Elementet bruges til at tilføje beskrivelse for billedet.
Eksempel:
Figure Caption Element
EDUCBA er en førende global leverandør af kvalitetsbaseret uddannelse, der imødekommer behovene 500.000+ medlemmer i 40+ lande.
EDUCBA (Corporate Bridge Consultancy Pvt Ltd)
Produktion:
Ovenstående kode viser resultatet som vist på nedenstående billede,
4.
Elementet bruges til at specificere overskriften for et dokument eller et afsnit på siden. Du kan definere mere end en header 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
Dokumentets indhold går her …
Produktion:
Ovenstående kode viser resultatet som vist på nedenstående billede,
5.
Elementet bruges til at specificere informationen som forfatteroplysninger, ophavsret, kontakt, links til relaterede dokumenter, sitemap og mange flere.
Eksempel:
Footer Element
Copyright © 2019 www.educba.com
Kontakt:
Produktion:
Ovenstående kode viser resultatet som vist på nedenstående billede,
6.
Elementet bruges til at vise de vigtigste dvs. vigtige oplysninger i et dokument.
Eksempel:
Main Element
Information om overskrift
Hovedoplysninger
EDUCBA
EDUCBA er en førende global leverandør af kvalitetsbaseret uddannelse …
Sidefodsoplysninger
Produktion:
Ovenstående kode producerer output som vist på nedenstående billede,
7.
Elementet bruges til at fremhæve eller markere teksten med den baggrundsfarve, der tiltrækker brugeren for en bestemt tekst på dokumentet.
Eksempel:
Mark Element
EDUCBA er en førende global leverandør af kvalitetsbaseret uddannelse, der imødekommer behovene 500.000+ medlemmer i 40+ lande.
Produktion:
Ovenstående kode viser resultatet som vist på nedenstående billede,
8.
Elementet bruges til at specificere navigationslinkene på siden. Disse links giver forbindelser til andre sider i et dokument.
Eksempel:
Nav Element
HTML |
CSS |
JAVA |
PHP |
PYTHON
Produktion:
Ovenstående kode producerer output som vist på nedenstående billede,
9.
Elementet bruges til at definere det enkeltstående afsnit eller det specifikke område i dokumentet.
Eksempel:
Section Element
Main Article
Section Element
Main Article
Section Element
Main Article
Indholdet af hovedoverskriften vises her …
Afsnit et
Indholdet af det første afsnit vises …
Afsnit to
Indholdet af det andet afsnit vises …
Produktion:
Ovenstående kode viser resultatet som vist på nedenstående billede,
10.
Mærkatet er et underpart af tagget, der indeholder teksten, der kan vises eller skjules, når brugeren klikker på overskriften.
Eksempel:
Summary Element
EDUCBA - Corporate Bridge Consultancy Pvt Ltd
Det er en førende global leverandør af kvalitetsbaseret uddannelse, der imødekommer behovene 500.000+ medlemmer i 40+ lande.
Produktion:
Når du kører ovenstående kode, viser det resultatet som vist nedenfor,
Som vist på billedet, skal du klikke på overskriften, den vil vise den skjulte tekst som vist på billedet herunder,
Konklusion
Indtil videre har vi set, hvordan nye HTML5-elementer er nyttige til forskellige opgaver i oprettelsen af webstedet. Disse nye elementer læser dokumentet på en mere nøjagtig og op til standard måde og udvikler mere komplekse og effektive webapps. De nye HTML5-elementer giver nogle ekstra ekstra funktioner til at generere interaktive websteder.
Anbefalede artikler
Dette er en guide til Html5 nye elementer. Her diskuterer vi de top 10 nye elementer i Html5 for at forbedre layoutet af dokumentet. Du kan også se på de følgende artikler for at lære mere -
- Farvekorrektion i After Effects
- Top 6 versioner af HTML
- Html5 vs Html4
- XHTML vs HTML5
- Hvad er Bridge?
- HTML5-tags | Top 4 tags af HTML5