Nyckel Skillnad - div mot spänna
 

HTML är ett mycket använt språk för att utveckla webbsidor. Den står för Hyper Text Markup Language. Termen Hyper avser att länka till andra webresurser på internet. Termen Markup avser förmågan att skapa formaterad text med bilder och andra multimedia resurser. Hyperlänkar är huvudkomponenterna i HTML som gör att alla webresurser kopplas samman. Det finns flera versioner av HTML. De är HTML 2.0, 3.2, 4.01 och HTML5. I grund och botten är HTML ett textdokument med taggar. Det berättar webbläsaren hur man strukturerar webbsidan för att visa den. Div och span är två taggar i HTML. Varje HTML-element har ett standardvisningsvärde beroende på elementets typ. Så, de kan vara ett block eller inline-element. I denna artikel diskuteras skillnaden mellan div och span. De nyckelskillnad mellan div och span är det div är ett blocknivåelement medan span är ett inline-element.

INNEHÅLL

1. Översikt och nyckelskillnad
2. Vad är div
3. Vad är spänningen
4. Likheter mellan div och span
5. Sida vid sida Jämförelse - div vs span i tabellform
6. Sammanfattning

Vad är div?

Alla HTML-dokument börjar med en dokumenttypdeklaration. Idag är den vanligaste versionen av HTML HTML5. Därför är typdeklarationen. Alla HTML-taggar bör ingå i och taggarna. De nödvändiga detaljerna på webbsidan ingår i taggen. Den synliga webbsidan är skriven inuti taggen. Det finns taggar för varje syfte. De

tagg används för stycken. De

,

etc. används för rubriker. Innehållet i start- och slutkoden är känt som ett element. t.ex.

Detta är en paragraf

.

Figur 01: HTML5

Varje HTML-element har ett standardvisningsvärde beroende på elementets typ. Standard visningsvärden kan antingen vara block eller inline. Blocknivåelementen börjar alltid med en ny linje. Dessa element tar hela tillgänglig bredd. Några exempel på blocknivåelement är

, ,

---

och .

Div-taggen är också ett blocknivåelement i HTML. Syntaxen är som följer.

Hej världen!

Div-elementen är en behållare till andra element. Därför kan en uppsättning av element packas in i div-elementet. När den används med Cascading Style Sheet (CSS), kan div-taggen användas för att ställa in ett innehållsblock. Se nedan stycket kod.

Två stycken finns inom div-taggen. Allt innehåll inom div-taggen har bakgrundsfärgen svart och teckensnittsfärgen vit.

Vad är spänningen?

Till skillnad från i blocknivåelement startar inline-elementen inte på en ny linje. Det tar bara den nödvändiga bredden. Några exempel på inline-element är , ,
och

Figur 02: div och span tag

Spännstaggen används som en behållare för lite text. Den här taggen kan också användas med CSS. Därför kan en del av texten utformas. Se nedan exempel. "Stycke 1" är inuti spännstaggen. Färg läggs till med hjälp av CSS-stilattributet.

Detta är stycket 1

Vad är likheterna mellan div och span?

• Både div och span grupperar taggar i HTML.
• Både div och span innehåller start-taggen och slutet taggen.
• Både div och span kan ha stilattribut.

Vad är skillnaden mellan div och span?

div vs span
Div är en HTML-kod som definierar en uppdelning eller en sektion i ett HTML-dokument.	Spännvidden är en HTML-tagg som används för att gruppera inline-element i ett HTML-dokument.
Användande
Div-taggen används som en behållare för andra element.	Spännstaggen används som en behållare för lite text.
Ny linje
Div-taggen börjar med en ny linje.	Spännstaggen börjar inte med en ny linje.
Obligatorisk bredd
Div-taggen tar hela bredden.	Spännstaggen tar bara den önskade bredden.
Syntax

Sammanfattning - div mot spänna 

HTML står för Hyper Text Markup Language. Det används för att utveckla webbplatser. Detta språk består av taggar. Div och span gruppering taggar i HTML. De används för att definiera en sektion i ett dokument. I den här artikeln förklarades skillnaden mellan div och span-taggar. Skillnaden mellan div och span är att div är ett blocknivåelement medan span är ett inline-element.

Ladda ner PDF från div vs span

Du kan ladda ner PDF-versionen av den här artikeln och använda den för offline-ändamål enligt citationsnotat. Vänligen ladda ner PDF-versionen här: Skillnad mellan div och span 

Referens:

1.tutorialspoint.com. "HTML-block". Punkten, Tillgänglig här  
2.HTML Block och Inline Elements. Tillgänglig här 

Image Courtesy:

1.'HTML5-logotyp och ordmärke "Med W3C, (CC BY 3.0) via Commons Wikimedia