HTML5: Nya funktioner, kompatibilitet, exempel

Annestin Sohlman December 25, 2015 Elektronisk 18 0
FONT SIZE:
fontsize_dec
fontsize_inc
HTML5 står för Hypertext Markup Language 5 och är efterföljaren till den införda HTML 4. HTML 5 är ännu inte slutförts under 1997, trots den mest moderna webbläsare som Firefox och Google Chrome kan redan hantera det snyggt. Den här artikeln tittar på nya tillämpningar och taggar som HTML 5 erbjudanden jämfört med HTML 4 / XHTML och andra programmeringsspråk, kommer förenligheten med de vanligaste webbläsarna studeras och visa några exempel.

Vad du bör veta innan du börjar kodning i HTML 5?

Först, ingen annan kodspråk HTML 5, är HTML 5 densamma som HTML 4, HTML 5 har bara några extra funktioner. Utvidgningen av en HTML5-dokument förblir bara .htm eller .html. Om du har en webbplats som fungerar enligt HTML 4 riktlinjerna kommer det här att göra exakt samma sak i HTML 5. Ett exempel: HTML5 stöder alla formulär taggar från HTML4, men har några extra ingång attribut. Till exempel kan du helt enkelt installera en datumväljare i ett textfält. Så länge webbläsaren i din besökare är HTML5-kompatibel, kommer du att använda datumväljaren kan klicka på ett datum. Om inte, kan du alltid bara skriva in datumet, eftersom input type själva texten ingenting har förändrats. Samma princip som orsakar alla element från HTML4 och HTML5 kan använda tidigare i ett dokument säkerställer att HTML5 troligen kommer att fortsätta så länge som Internet fortfarande existerar. Hög tid att gräva i ytterligare funktioner i HTML5 så.

När ett dokument är HTML5?

Ett dokument är en HTML5 dokument när det innehåller följande rad på toppen av all kod. Denna regel anger doctype till HTML5.

Officiellt är det dokument nu HTML5, är det självklart att nu här verkligen vet vad de ska göra med det, måste du stoppa HTML5 funktioner i skriptet.

Nya funktioner i HTML5

Ett antal viktiga och omdiskuterade nya funktioner som HTML5 kommer att föra med sig, kommer att förklaras mer i detalj nedan.
Gör din text redigerbar
Denna nya attribut kan associeras med varje element, och användaren kommer att kunna skräddarsy texten på hemsidan. I exemplet kommer innehållet i ett stycke vara redigerbar nedan.

Denna text är redigerbar
Formulärbaserad verifiering
När en e-postadress som ska fyllas i ett formulär, kan du lägga till ett inmatningsfält med den nya typen ?? e ??. Detta kontrollerar automatiskt på den färdiga adressen om det är en riktig e-postadress.

Om du vill att besökaren att bilda sin adress faktiskt fyller, kan du ?? nya krävs ?? Lägger attribut:

Värde ledighet
I HTML4 du hade värdet attributet för att visa en vanlig text i ett inmatningsfält, om du har klickat på fältet, gick texten iväg och kom aldrig tillbaka. Den nya platshållare attributet ?? ?? säkerställer att tomma inmatningsfält, var kommer att placeras en viss text.

Rubrik grupp
I HTML5 kan du med det nya elementet ?? hgroup ?? flera huvuden grupp som dessa hör ihop.

Rubrik

Underrubrik
Markera text
Detta element inte lägga mycket, men gör till exempel att lyfta fram sökningar lättare.
Denna text är detta avsnitt markerad.
Ljudstöd
Tillsammans med video ?? ?? och ?? duk ?? en av de mest eftertraktade nya element i HTML5. Var i HTML4 och tidigare fortfarande på tredje part plugins för att vara väl förtrogen med genomförandet av ljudet på en webbsida, HTML kan nu själv:

Videosupport
Fungerar på samma sätt som ljud ?? ?? element, videofiler som visar på en webbplats utan ingripande av tredje part.

Rita på en webbplats
Den nya arbetsytan elementet ?? ?? skapar en mer dynamisk webbplats. Den kan automatiskt göra bitmap bilder med hjälp av javascript. Det finns till exempel möjlighet att utnyttja en webbplats som kommer att sätta en linje mellan två punkter med javascript. Mycket har varit på duken ?? ?? elementet är inte känt ännu.

HTML5 kompatibilitet

HTML5 inte helt färdig, men arbetar i ett antal samverkande webbläsare.
Google Chrome webbläsare bäst att ta itu med HTML 5. Således, version 5.0.375.55 av Chrome inkluderar canvas och video inslag perfekt, form-attribut och ljudelementet också vara trevligt.
Safari gör sämre än Chrome, så gör videoelementet förutom ljud och formen fortfarande inte perfekt. Canvas fungerar optimalt.
Opera kommer också att fungera igen perfekt med ljud, video och duk, men kan också vara en hel del inte bra att inte alls.
Mozila Firefox fungerar bra inklusive duk, men ändå inte super audio och video.
Internet Explorer är långt HTML5-klar. Dock kan den här webbläsaren, som alla nya doctype till HTML5. Så börja nu med att byta ut din gamla HTML4 till HTML5 doctype eller xhtml1. Det kan inte skada dig, och förbered dig för vad som kommer.

Exempel HTML5 webbsidor

Vanliga exempel per element: http://www.html5demos.com/
Ljud och twitter i en mycket dynamisk webbplats: http://www.9elements.com/io/projects/html5/canvas/
Vad du inte kan göra allt med duk: http://www.canvasdemos.com/
  Like 0   Dislike 0
Kommentarer (0)
Inga kommentarer

Lägg till en kommentar

smile smile smile smile smile smile smile smile
smile smile smile smile smile smile smile smile
smile smile smile smile smile smile smile smile
smile smile smile smile
Tecken kvar: 3000
captcha