Forskellen mellem DIV og SPAN

og er HTML-tags, der definerer elementer i HTML-kode.

HTML (Hypertext Markup Language) er en struktureret kode, der bruges til at opbygge og vise de websider, vi besøger online, hver dag, på enhver enhed.

Andre teknologier og programmeringssprog kan integreres med HTML for at give dynamiske og avancerede funktioner på et websted.

Forståelse af HTML

Hypertext Markup Language (HTML) er et meget brugt markeringssprog og henviser til strukturen og koden 'bag' en webside, der vises i en webbrowser.

HTML er en tekstfil, der bruger specifik kode (syntaks) til at definere en sides stil, indhold, layout og format. Det markup udtryk angiver, at teksten / koden forberedes til behandling og præsentation, dvs. på en webside, i en webbrowser.

World Wide Web Consortium (W3C) [i] genkender HTML som et formelt markupsprog i websidens udvikling, og derfor understøttes HTML af de fleste browsere. Så websider kan udvikles på et anerkendt sprog, der let kan tolkes af forskellige browsere for at gengive siden som beregnet af designeren.

Den aktuelle version, der stadig bruges, er HTML4, men den udfases langsomt, da HTML5 får mere støtte og vedtagelse til dynamiske og lydhøre websider.

Responsivitet er ved at blive en grundlæggende komponent i webudvikling for at give en lettere, mere dynamisk brugeroplevelse, som skal tilpasses flere enheder som smartphones, tablets og laptops.

Cascading Style Sheets (CSS) bliver en integreret del af opbygningen af ​​dynamiske og lydhøre sider. Det er en separat fil, der definerer attributter for hvert element som font, farve, justering - så udvikleren ikke har angiver elementets stil hver gang det bruges i HTML-koden.

Grundlæggende struktur af HTML

For at få mest muligt ud af ethvert udviklingssprog er overholdelse af standard filstruktur og overvejelse af bedste syntaksbrug nøglen til at levere stabilt, målrettet og visuelt tiltalende webindhold.

En HTML-side har en struktur defineret af elementer (også kaldet tags). Når du skriver HTML-koden, vises disse elementer parvis - det betyder, at ethvert tag har brug for en åbning og en lukning. En start og en ende.

Et element åbnes med syntaks: og lukket med.  Det / skrå linje angiver slutningen på elementets definition.

Elementattributterne og indholdet er defineret mellem disse to punkter.

Det minimum elementer krævet til en HTML-fil er definitionen,, (kun HTML4) og tags.

• DOCTYPE-definition

Definitionen (DTD) skal først deklareres som det første tag i en HTML-fil, så når siden behandles, kender webbrowseren hvilken filtype den er, og kan derfor fortolke og vise siden korrekt.

I HTML4 er der variationer af DTD (afhængigt af sideattributterne og -elementerne), men de mere typiske udsagn er inkluderet som:

eller

DTD i HTML5 er meget enklere:

· HTML, HEAD og BODY

• Mærket indikerer, at det er en HTML-fil, og dette er roden til HTML-elementet, der indeholder alle andre efterfølgende elementer, der er defineret i det; og inklusive en sprogattribut anbefales som bedste praksis; for eksempel:

• Det kræves i HTML4, men ikke obligatorisk i HTML5. Det er et element, der indeholder andre elementer, der er relevante for denne dokumentdel, såsom titlen, henvisningsskripts, definition af stilarter og metadata. Det lukkede tag skal bruges, før definering af 
• Elementet indeholder hovedindholdet for siden, inklusive tabeller, billedtekst, lister osv. Når mærket er lukket, kan elementet nu slutte. Brug af det nye HTML5-element er valgfrit for siden eller i en anden del af indholdet.

HTML-elementer

HTML5 har produceret nye elementer for at lette udvikling og design, og det har også fjernet elementer, der er brugt i HTML4. Listen over forskelle mellem HTML4 og HTML5 er offentliggjort af World Wide Web Consortium (W3C) [ii].

HTML DIV-TAG

Sammen med forbedringerne og nye elementer kombineret med CSS-fremskridtene kan visse elementer bruges på forskellige, bedre måder end før, og websider bliver hurtigere, mere funktionsrige og smukke at se på! med CSS, der bruges med HTML5, kan erstatte bestemte elementer, der blev brugt overdrevent, f.eks .

Mærket er populært, når man adskiller indhold på en side. Når du opretter dette element, indsætter det automatisk en pause
for at holde teksten eller indholdet sammen, i stedet for at gå tekst på tværs af siden.

Med webstedets tilgængelighed og søgemaskineoptimering bliver teknikker en videnskab og anbefales af WC3 for ikke altid at vende tilbage til at bruge i HTML5.

Som et eksempel på et pænt struktureret, men simpelt blogformat, skal du overveje de nye HTML5-elementer med CSS i stedet for at bruge elementet; Brug elementet til hovedindhold, elementet til at fremhæve eller adskille ethvert indhold på siden, header eller sidefod (hvor som helst!), og elementet kan bruges til at holde en menu eller gruppelink til at gennemse fra siden.

Disse nye elementer identificerer let indholdstypen ved hjælp af HTML5. Imidlertid bruges tagget også med CSS til at oprette responsive websteder.

Oprettelse af hvert element (med sit 'eget id eller klasse), CSS-filen kan defineres til at manipulere hvert element.

HTML-eksemplet nedenfor viser et eksempel på brug af flere elementer:

Mine eksempler

Elementerne kan have forskellige attributter, specifikt forskellige størrelser til responsiv interaktion afhængigt af skærmstørrelsen på den enhed, der bruges.

Her er et eksempel på, hvordan hvert element kan styles i HTML's tilsvarende CSS-fil - ved at henvise til hvert tag.

#Header

bredde: 800px;

højde: auto

margin-left: auto;

margin-left: auto;

#Featured

højde: 150 pixel;

Background-color: #CCC;

HTML SPAN TAG

Elementet er et inlineelement og bryder ikke i linjer, medmindre bruddet
tag bruges, og den definerede tekst (indhold) mellem de åbne og lukke tags vises som en linje (som standard uden brug af andre elementer).

Inlineelementer er tekstelementer i HTML-filen og kan defineres inden for linjen med et andet element.

Som elementet har ingen betyder for optimal henvisning. Det viser grundlæggende elementindholdet, som det er, men alle tilfælde kan defineres i CSS til styling, hvis de er mærket korrekt og beriget med andre attributter eller manipuleret med JavaScript.

I eksemplet nedenfor fremhæver den blå tekst, hvordan spanelementet kan indlejres som et inline-element med forskellige attributter end dets overordnede element - afsnittet p>:

For at åbne eksemplet skal du klikke på ikonet i bunden af ​​siden.

Når den ses i en webbrowser, vises teksten i elementet ovenfor i en anden skrifttype end afsnittet for at understrege, hvor brugeren skal klikke for at få adgang til eksemplet.

Bemærk, at der ikke er nogen forskelle mellem HTML4 og HTML5.