HTML -zelfstudie

HTML HOME HTML-introductie HTML-editors HTML basis HTML-elementen HTML-kenmerken HTML-koppen HTML-alinea's HTML-stijlen HTML-opmaak HTML-citaten HTML-opmerkingen HTML-kleuren HTML-CSS HTML-links HTML-afbeeldingen HTML-favicon HTML-tabellen HTML-lijsten HTML-blok en inline HTML-klassen HTML-ID HTML-iframes HTML-JavaScript Paden voor HTML-bestanden HTML-kop HTML-indeling HTML-responsief HTML-computercode HTML-semantiek HTML-stijlgids HTML-entiteiten HTML-symbolen HTML-emoji's HTML-tekenset HTML-URL-codering HTML versus XHTML

HTML -formulieren

HTML-formulieren HTML-formulierkenmerken HTML-formulierelementen HTML-invoertypen HTML-invoerkenmerken Kenmerken HTML-invoerformulier

HTML -afbeeldingen

HTML-canvas HTML-SVG

HTML- media

HTML-media HTML-video HTML-audio HTML-plug-ins HTML-YouTube

HTML API's

HTML-geolocatie HTML slepen/neerzetten HTML-webopslag HTML-webwerkers HTML-SSE

HTML- voorbeelden

HTML-voorbeelden HTML-quiz HTML-oefeningen HTML-certificaat HTML-samenvatting HTML-toegankelijkheid

HTML- verwijzingen

HTML-taglijst HTML-kenmerken Algemene HTML-kenmerken Ondersteuning voor HTML-browser HTML-gebeurtenissen HTML-kleuren HTML-canvas HTML-audio/video HTML-documenttypen HTML-tekensets HTML-URL-codering HTML-taalcodes HTTP-berichten HTTP-methoden PX naar EM-omzetter Toetsenbord sneltoetsen

HTML -blok- en inline-elementen


Elk HTML-element heeft een standaardweergavewaarde, afhankelijk van het type element.

Er zijn twee weergavewaarden: block en inline.


Elementen op blokniveau

Een element op blokniveau begint altijd op een nieuwe regel.

Een element op blokniveau neemt altijd de volledige beschikbare breedte in beslag (strekt zich links en rechts zo ver mogelijk uit).

Een element op blokniveau heeft een boven- en een ondermarge, terwijl een inline-element dat niet heeft.

Het <div>-element is een element op blokniveau.

Voorbeeld

<div>Hello World</div>

Dit zijn de elementen op blokniveau in HTML:


Inline-elementen

Een inline element begint niet op een nieuwe regel.

Een inline element neemt slechts zoveel breedte in beslag als nodig is.

Dit is een <span>-element in een alinea.

Voorbeeld

<span>Hello World</span>

Dit zijn de inline-elementen in HTML:

Opmerking: een inline-element kan geen element op blokniveau bevatten!


Het <div>-element

Het <div>element wordt vaak gebruikt als container voor andere HTML-elementen.

Het <div>element heeft geen vereiste attributen, maar style, classen idkomen vaak voor.

Bij gebruik in combinatie met CSS kan het <div>element worden gebruikt om inhoudsblokken te stylen:

Voorbeeld

<div style="background-color:black;color:white;padding:20px;">
  <h2>London</h2>
  <p>London is the capital city of England. It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants.</p>
</div>

Het <span>-element

Het <span>element is een inline container die wordt gebruikt om een ​​deel van een tekst of een deel van een document te markeren.

Het <span>element heeft geen vereiste attributen, maar style, classen idkomen vaak voor.

In combinatie met CSS kan het <span>element worden gebruikt om delen van de tekst op te maken:

Voorbeeld

<p>My mother has <span style="color:blue;font-weight:bold">blue</span> eyes and my father has <span style="color:darkolivegreen;font-weight:bold">dark green</span> eyes.</p>

Hoofdstuk samenvatting

  • Er zijn twee weergavewaarden: block en inline
  • Een element op blokniveau begint altijd op een nieuwe regel en neemt de volledige beschikbare breedte in beslag
  • Een inline element begint niet op een nieuwe regel en neemt slechts zoveel breedte in beslag als nodig is
  • Het <div>element is een blokniveau en wordt vaak gebruikt als een container voor andere HTML-elementen
  • Het <span>element is een inline container die wordt gebruikt om een ​​deel van een tekst of een deel van een document te markeren

HTML-tags

Tag Description
<div> Defines a section in a document (block-level)
<span> Defines a section in a document (inline)

Bezoek onze HTML Tag Reference voor een volledige lijst van alle beschikbare HTML-tags .