XHTML-introductie

XHTML-introductie

XHTML- of UITBREIDBARE HyperText-opmaaktaal is een mix van HTML en XML, zeer vergelijkbaar met HTML maar strenger. Het is als een regelboek voor het maken van webpagina’s die browsers gemakkelijk begrijpen. In tegenstelling tot HTML moet je voorzichtig zijn en de regels nauwkeurig volgen. De meeste browsers ondersteunen het. Zie het maar als een preciezere manier om webcode te schrijven.

Inhoudsopgave

Geschiedenis

Het is ontwikkeld door het World Wide Web Consortium (W3C) en helpt webontwikkelaars bij de overstap van HTML naar XML. Met XHTML kunnen ontwikkelaars de XML-wereld met al zijn mogelijkheden betreden, terwijl ze toch achterwaartse en toekomstige compatibiliteit van de inhoud garanderen. De XHTML-familie omvat drie documenttypen; de eerste is XHTML 1.0, aanbevolen door W3C op 26 januari 2000. De tweede is XHTML 1.1, aanbevolen door W3C op 31 mei 2001.

De derde is XHTML5, een standaard die wordt gebruikt voor het ontwikkelen van een XML-aanpassing van de HTML5-specificatie. Een XHTML-document moet een XHTML-declaratie hebben.

Elementen van XHTML:

XHTML-element Beschrijving
> Wordt gebruikt om de Document Type Definition (DTD) te declareren, waarbij de regels voor de opmaaktaal worden gespecificeerd, waardoor een goede weergave in browsers wordt gegarandeerd.
> Omsluit het volledige HTML- of XHTML-document en dient als hoofdelement.
> Bevat meta-informatie over het document, zoals de titel, tekenset, gekoppelde stylesheets en andere essentiële elementen.
> Genest in de hoofdsectie, specificeert de titel van het document, weergegeven in de titelbalk of het tabblad van de browser.
> Omvat de inhoud van de webpagina, inclusief tekst, afbeeldingen, links en andere HTML-elementen. Het vertegenwoordigt het zichtbare deel van het document dat in de browser wordt weergegeven.

Bij het maken van een XHTML-webpagina is het noodzakelijk om een ​​DTD-declaratie (Document Type Definition) op te nemen. Er zijn drie soorten DTD die hieronder worden besproken:

Overgangs-DTD:

Het wordt ondersteund door de oudere browsers die geen ingebouwde ondersteuning voor trapsgewijze stijlbladen hebben. Er zijn verschillende attributen ingesloten in de body-tag die niet zijn toegestaan ​​in strikte DTD.

Syntaxis:

 PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN' 'DTD/xhtml1-transitional.dtd'> 

Voorbeeld: In dit voorbeeld zien we de code voor het schrijven van een XHTML-document met een voorbeeld.

html




xml version='1.0' encoding='UTF-8'?> Transitionele DTD XHTMLtitel> hoofd> <body bgcolor='#dae1ed'> <div>lettertype-gewicht:vet;tekst-uitlijnen:gecentreerd; margin-bottom:-25px;'>techcodeview.comdiv> <p style='text-align:center;font-size:20px;'>Een informaticaportaal <p style='text-align:center;font-size:20px;'>Optie om maand te kiezen: <select name='month'> <option selected='selected'>Januarioptie> <option>Februarioptie> <option>Maartoptie> <option>Apriloptie> <option>Mayoptie> <option>Junioptie> <option>Julioptie> <option>Augusyoptie> <option>September optie> <option>Oktoberoptie> <option>Novemberoptie> <option>Decemberoptie> selecteren> p> body> html>> </code> </td> </tr> </tbody> </table> <p> </p> <i id='output-icon' title='Output'> </i> <p> </p> <p> </p> <i id='copy-url-button' title='Copy Generated Ide URL'> </i> <p> </p> <p> </p> <p dir='ltr'> <b> <strong>Uitgang: </strong> </b> </p> <p> <img src='//techcodeview.com/img/html-xml/79/xhtml-introduction.webp' alt='transitionele dtd xhtml'> <span> </span> </p> <h2 id='strict-dtd'> <b> <strong>Strikte DTD: </strong> </b> <span> </span> </h2> <p dir='ltr'> <span>Strikte DTD wordt gebruikt wanneer de XHTML-pagina alleen opmaaktaal bevat. Strikte DTD wordt gebruikt in combinatie met trapsgewijze stijlbladen, omdat dit attribuut geen CSS-eigenschap in de body-tag toestaat. </span> </p> <h3> <b> <strong>Syntaxis: </strong> </b> </h3> <pre> PUBLIC '-//W3C//DTD XHTML 1.0 Strict//EN' 'DTD/xhtml1-strict.dtd'> </pre> <p dir='ltr'> <b> <strong>Voorbeeld 2: </strong> </b> <span>In dit voorbeeld zien we de code voor het schrijven van een XHTML-document met een voorbeeld voor strikte DTD. </span> </p> <h2>html </h2> <i id='copy-code-button' title='Copy Code'> </i> <p> </p> <p> <i id='run-and-edit-button' title='Edit Code' lang='xml'> </i> <br> </p> <p> <i id='run-code-button' lang='xml' title='Run Code and See Output'> </i> </p> <p> <i id='generate-url-and-run-button' title='Run Code and Generate IDE URL' lang='xml'> </i> <br> <i title='Dark Mode'> </i> <br> <i id='edit-on-ide-button' title='Edit on IDE' lang='xml'> </i> </p> <p> </p> <table class="table"> <tbody> <tr> <td> <code>xml version='1.0' encoding='UTF-8'?> <html xmlns=' http://www.w3.org/1999/xhtml ' xml:lang='en' lang='en'> <head> <title>Strikte DTD XHTMLtitel> hoofd> <body> <div>lettertype-gewicht:vet;tekst-uitlijnen:gecentreerd; margin-bottom:-25px;'>techcodeview.comdiv> <p style='text-align:center;font-size:20px;'>Een informaticaportaal <p style='text-align:center;font-size:20px;'>Optie om maand te kiezen: <select name='month'> <option selected='selected'>Januarioptie> <option>Februarioptie> <option>Maartoptie> <option>Apriloptie> <option>Mayoptie> <option>Junioptie> <option>Julioptie> <option>Augusyoptie> <option>September optie> <option>Oktoberoptie> <option>Novemberoptie> <option>Decemberoptie> selecteren> p> body> html>> </code> </td> </tr> </tbody> </table> <p> </p> <i id='output-icon' title='Output'> </i> <p> </p> <p> </p> <i id='copy-url-button' title='Copy Generated Ide URL'> </i> <p> </p> <p> </p> <p dir='ltr'> <b> <strong>Uitgang: </strong> </b> </p> <p> <span> </span> <img src='//techcodeview.com/img/html-xml/79/xhtml-introduction-2.webp' alt='strikte dtd xhtml'> <span> </span> </p> <h2 id='frameset-dtd'> <b> <strong>Frameset-DTD: </strong> </b> <span> </span> </h2> <p dir='ltr'> <span>De frameset DTD wordt gebruikt wanneer de XHTML-pagina frames bevat. Deze DTD is identiek aan de HTML 4.01 Transitional DTD, behalve het inhoudsmodel van het HTML-element. </span> </p> <h3> <b> <strong>Syntaxis: </strong> </b> </h3> <pre> PUBLIC '-//W3C//DTD XHTML 1.0 Frameset//EN' 'DTD/xhtml1-frameset.dtd'> </pre> <p dir='ltr'> <b> <strong>Voorbeeld 2: </strong> </b> <span>In dit voorbeeld zien we de code voor het schrijven van een XHTML-document met een voorbeeld voor frameset DTD. </span> </p> <h2>html </h2> <i id='copy-code-button' title='Copy Code'> </i> <p> </p> <p> <i id='run-and-edit-button' title='Edit Code' lang='xml'> </i> <br> </p> <p> <i id='run-code-button' lang='xml' title='Run Code and See Output'> </i> </p> <p> <i id='generate-url-and-run-button' title='Run Code and Generate IDE URL' lang='xml'> </i> <br> <i title='Dark Mode'> </i> <br> <i id='edit-on-ide-button' title='Edit on IDE' lang='xml'> </i> </p> <p> </p> <table class="table"> <tbody> <tr> <td> <code>xml version='1.0' encoding='UTF-8'?>http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd '> <html xmlns=' http://www.w3.org/1999/xhtml ' xml:lang='en' lang='en'> <head> <title>Frameset DTD XHTMLtitel> kop> <frameset cols='30%, 20%, *'> <frameset rows='40%, 30%, *'> <frame src='gfg.html' /> <frame src='gfg1.html' /> <frame src='geeks.html' />frameset> <frameset rows='40%, 60%'> <frame src='g4g.html' /> <frame src='g4g1.html' />frameset> <frameset rows='20%, 20%, 30%, *'> <frame src='geeksforgeeks.html' /> <frame src='geeksforgeeks1.html' /> <frame src='geeksforgeeks2.html' /> <frame src='geeksforgeeks3.html' />frameset> frameset> html>> </code> </td> </tr> </tbody> </table> <p> </p> <i id='output-icon' title='Output'> </i> <p> </p> <p> </p> <i id='copy-url-button' title='Copy Generated Ide URL'> </i> <p> </p> <p> </p> <p dir='ltr'> <b> <strong>Uitgang: </strong> </b> </p> <h2 id='why-use-xhtml'> <img src='//techcodeview.com/img/html-xml/79/xhtml-introduction-3.webp' alt='frameset dtdxhtml'> <b> <strong>Waarom XHTML gebruiken? </strong> </b> </h2> <ul> <li value='1'> <span>XHTML-documenten worden gevalideerd met standaard XML-tools. </span> </li> <li value='2'> <span>Het is gemakkelijk om op de lange termijn een document te onderhouden, converteren en bewerken. </span> </li> <li value='3'> <span>Het wordt gebruikt om de kwaliteitsnorm van webpagina's te definiëren. </span> </li> <li value='4'> <span>XHTML is een officiële standaard van het W3C, uw website wordt compatibeler en nauwkeuriger met veel browsers. </span> </li> </ul> <h2 id='benefits-of-xhtml'> <b> <strong>Voordelen van XHTML: </strong> </b> </h2> <ul> <li value='1'> <span>Alle XHTML-tags moeten afsluitende tags hebben en zijn correct genest. Dit genereert schonere code. </span> </li> <li value='2'> <span>XHTML-documenten zijn lean, wat betekent dat ze minder bandbreedte gebruiken. Dit verlaagt de kosten, vooral als uw website duizenden pagina's heeft. </span> </li> <li value='3'> <span>XHTML-documenten zijn goed opgemaakt en kunnen gemakkelijk worden getransporteerd naar draadloze apparaten, braillelezers en andere gespecialiseerde webomgevingen. </span> </li> <li value='4'> <span>Alle nieuwe ontwikkelingen zullen plaatsvinden in XML (waarvan XHTML een applicatie is). </span> </li> <li value='5'> <span>XHTML werkt samen met CSS om webpagina's te maken die gemakkelijk kunnen worden bijgewerkt. </span> </li> </ul> <h2 id='difference-between-html-and-xhtml'> <b> <strong>Verschil tussen HTML en XHTML: </strong> </b> </h2> <table class="table"> <tbody> <tr> <th> <span>HTML </span> </th> <th> <span>XHTML </span> </th> </tr> </tbody> <tbody> <tr> <td> <span>HTML of HyperText Markup Language is de belangrijkste opmaaktaal voor het maken van webpagina's </span> </td> <td> <span>XHTML (Extensible HyperText Markup Language) is een familie van XML-opmaaktalen die versies van de veelgebruikte Hypertext Markup Language (HTML) spiegelen of uitbreiden. </span> </td> </tr> <tr> <td> <span>Flexibel raamwerk dat een soepele HTML-specifieke parser vereist </span> </td> <td> <span>Beperkende subset van XML die moet worden geparseerd met standaard XML-parsers </span> </td> </tr> <tr> <td> <span>Voorgesteld door Tim Berners-Lee in 1987 </span> </td> <td> <span>Aanbeveling van het World Wide Web Consortium in 2000. </span> </td> </tr> <tr> <td> <span>Toepassing van standaard gegeneraliseerde opmaaktaal (SGML). </span> </td> <td> <span>Toepassing van XML </span> </td> </tr> <tr> <td> <span>Uitgebreid van SGML. </span> </td> <td> <span>Uitgebreid van XML, HTML </span> </td> </tr> </tbody> </table> <br> <br> </div> <!-- Article Footer with Prominent Share Buttons --> <div class="px-6 md:px-8 py-8 bg-slate-50 dark:bg-slate-900/50 border-t border-slate-200 dark:border-slate-700/50"> <div class="flex flex-col sm:flex-row items-center justify-between gap-6"> <h4 class="text-base font-bold text-slate-700 dark:text-slate-300 uppercase tracking-wide flex items-center gap-2"> <i class="fa fa-share-alt text-tech-500"> </i> Deel </h4> <div class="flex flex-wrap justify-center gap-3"> <!-- Twitter --> <a href="https://twitter.com/intent/tweet?text=XHTML-introductie&url=https://www.techcodeview.com/nl/xhtml-introduction" target="_blank" rel="noopener noreferrer" class="flex items-center gap-2 px-6 py-3 rounded-xl bg-[#1DA1F2]/10 text-[#1DA1F2] hover:bg-[#1DA1F2] hover:text-white transition-all duration-300 font-bold text-sm"> <i class="fa fa-twitter text-lg"> </i> <span class="hidden sm:inline">Twitter </span> </a> <!-- Facebook --> <a href="https://www.facebook.com/sharer/sharer.php?u=https://www.techcodeview.com/nl/xhtml-introduction" target="_blank" rel="noopener noreferrer" class="flex items-center gap-2 px-6 py-3 rounded-xl bg-[#4267B2]/10 text-[#4267B2] hover:bg-[#4267B2] hover:text-white transition-all duration-300 font-bold text-sm"> <i class="fa fa-facebook text-lg"> </i> <span class="hidden sm:inline">Facebook </span> </a> <!-- LinkedIn --> <a href="https://www.linkedin.com/shareArticle?mini=true&url=https://www.techcodeview.com/nl/xhtml-introduction&title=XHTML-introductie" target="_blank" rel="noopener noreferrer" class="flex items-center gap-2 px-6 py-3 rounded-xl bg-[#0077b5]/10 text-[#0077b5] hover:bg-[#0077b5] hover:text-white transition-all duration-300 font-bold text-sm"> <i class="fa fa-linkedin text-lg"> </i> <span class="hidden sm:inline">LinkedIn </span> </a> </div> </div> </div> </article> <!-- Comments Placeholder / Random Articles --> <div class="mt-8 bg-white dark:bg-slate-800 border border-slate-200 dark:border-slate-700 rounded-xl p-6 md:p-8 shadow-sm"> <h3 class="text-xl font-bold text-slate-900 dark:text-white mb-6 uppercase tracking-wide border-b border-slate-200 dark:border-slate-700 pb-2"> Dit Vind Je Misschien Leuk </h3> <div class="grid grid-cols-1 md:grid-cols-2 gap-6"> <div class="group"> <a href="/nl/inline-functions-c" class="block aspect-video rounded-lg overflow-hidden bg-slate-200 dark:bg-slate-700 mb-3"> <img loading="lazy" src="https://techcodeview.com/img/cpp-functions/26/inline-functions-c.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Inline-functies in C++" class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500"> </a> <h4 class="font-bold text-slate-900 dark:text-white leading-tight group-hover:text-tech-500 transition-colors"> <a href="/nl/inline-functions-c">Inline-functies in C++ </a> </h4> </div> <div class="group"> <a href="/nl/mathematics-law-total-probability" class="block aspect-video rounded-lg overflow-hidden bg-slate-200 dark:bg-slate-700 mb-3"> <img loading="lazy" src="https://techcodeview.com/img/it-problems-solutions/92/mathematics-law-total-probability.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Wiskunde – Wet van totale waarschijnlijkheid" class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500"> </a> <h4 class="font-bold text-slate-900 dark:text-white leading-tight group-hover:text-tech-500 transition-colors"> <a href="/nl/mathematics-law-total-probability">Wiskunde – Wet van totale waarschijnlijkheid </a> </h4> </div> </div> </div> </div> <!-- SECONDARY COLUMN (SIDEBAR) --> <!-- Aside Column --> <div class="lg:col-span-4 space-y-8"> <!-- Best Articles Widget --> <div class="rounded-xl bg-white dark:bg-slate-800 border border-slate-200 dark:border-slate-700 p-6 shadow-sm"> <div class="mb-4 border-b border-slate-100 dark:border-slate-700 pb-2"> <h2 class="text-lg font-bold text-slate-900 dark:text-white uppercase tracking-wide flex items-center"> <span class="mr-2 h-2 w-2 rounded-full bg-tech-500"> </span> Top Artikelen </h2> </div> <!-- Owl Carousel Preserved Container --> <div id="owl-carousel-3" class="owl-carousel owl-theme center-owl-nav"> <!-- ARTICLE --> <article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors"> <div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700"> <a href="/nl/is-sat-hard-expert-analysis-8-key-factors-131770"> <img src="https://techcodeview.com/img/blog/74/is-sat-hard-expert-analysis-8-key-factors.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Is de SAT moeilijk? Deskundige analyse van 8 sleutelfactoren" class="w-full h-full object-cover"> </a> </div> <div class="flex-1 min-w-0"> <h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug"> <a href="/nl/is-sat-hard-expert-analysis-8-key-factors-131770" class="hover:text-tech-500 transition-colors line-clamp-3">Is de SAT moeilijk? Deskundige analyse van 8 sleutelfactoren </a> </h4> </div> </article> <!-- /ARTICLE --> <!-- ARTICLE --> <article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors"> <div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700"> <a href="/nl/pyspark-tutorial"> <img src="https://techcodeview.com/img/pyspark-tutorial/70/pyspark-tutorial.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="PySpark-zelfstudie" class="w-full h-full object-cover"> </a> </div> <div class="flex-1 min-w-0"> <h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug"> <a href="/nl/pyspark-tutorial" class="hover:text-tech-500 transition-colors line-clamp-3">PySpark-zelfstudie </a> </h4> </div> </article> <!-- /ARTICLE --> <!-- ARTICLE --> <article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors"> <div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700"> <a href="/nl/difference-between-log"> <img src="https://techcodeview.com/img/math-concepts/13/difference-between-log.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Verschil tussen log en Ln" class="w-full h-full object-cover"> </a> </div> <div class="flex-1 min-w-0"> <h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug"> <a href="/nl/difference-between-log" class="hover:text-tech-500 transition-colors line-clamp-3">Verschil tussen log en Ln </a> </h4> </div> </article> <!-- /ARTICLE --> <!-- ARTICLE --> <article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors"> <div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700"> <a href="/nl/reading-writing-json-file-python"> <img src="https://techcodeview.com/img/python-file-handling/38/reading-writing-json-file-python.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="JSON lezen en schrijven naar een bestand in Python" class="w-full h-full object-cover"> </a> </div> <div class="flex-1 min-w-0"> <h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug"> <a href="/nl/reading-writing-json-file-python" class="hover:text-tech-500 transition-colors line-clamp-3">JSON lezen en schrijven naar een bestand in Python </a> </h4> </div> </article> <!-- /ARTICLE --> <!-- ARTICLE --> <article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors"> <div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700"> <a href="/nl/python-exercise-with-practice-questions"> <img src="https://techcodeview.com/img/it-problems-solutions/71/python-exercise-with-practice-questions.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Python-oefening met oefenvragen en oplossingen" class="w-full h-full object-cover"> </a> </div> <div class="flex-1 min-w-0"> <h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug"> <a href="/nl/python-exercise-with-practice-questions" class="hover:text-tech-500 transition-colors line-clamp-3">Python-oefening met oefenvragen en oplossingen </a> </h4> </div> </article> <!-- /ARTICLE --> <!-- ARTICLE --> <article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors"> <div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700"> <a href="/nl/binary-decoder-digital-logic"> <img src="https://techcodeview.com/img/it-problems-solutions/35/binary-decoder-digital-logic.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Binaire decoder in digitale logica" class="w-full h-full object-cover"> </a> </div> <div class="flex-1 min-w-0"> <h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug"> <a href="/nl/binary-decoder-digital-logic" class="hover:text-tech-500 transition-colors line-clamp-3">Binaire decoder in digitale logica </a> </h4> </div> </article> <!-- /ARTICLE --> <!-- ARTICLE --> <article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors"> <div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700"> <a href="/nl/one-billion-lakhs"> <img src="https://techcodeview.com/img/maths/22/one-billion-lakhs.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Eén miljard in lakhs" class="w-full h-full object-cover"> </a> </div> <div class="flex-1 min-w-0"> <h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug"> <a href="/nl/one-billion-lakhs" class="hover:text-tech-500 transition-colors line-clamp-3">Eén miljard in lakhs </a> </h4> </div> </article> <!-- /ARTICLE --> <!-- ARTICLE --> <article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors"> <div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700"> <a href="/nl/nmap-cheat-sheet"> <img src="https://techcodeview.com/img/it-problems-solutions/53/nmap-cheat-sheet.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Nmap-spiekbriefje" class="w-full h-full object-cover"> </a> </div> <div class="flex-1 min-w-0"> <h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug"> <a href="/nl/nmap-cheat-sheet" class="hover:text-tech-500 transition-colors line-clamp-3">Nmap-spiekbriefje </a> </h4> </div> </article> <!-- /ARTICLE --> <!-- ARTICLE --> <article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors"> <div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700"> <a href="/nl/finding-sum-of-digits-of-a-number-until-sum-becomes-single-digit"> <img src="https://techcodeview.com/img/mathematical/70/finding-sum-of-digits-of-a-number-until-sum-becomes-single-digit.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="De som van de cijfers van een getal vinden totdat de som één cijfer wordt" class="w-full h-full object-cover"> </a> </div> <div class="flex-1 min-w-0"> <h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug"> <a href="/nl/finding-sum-of-digits-of-a-number-until-sum-becomes-single-digit" class="hover:text-tech-500 transition-colors line-clamp-3">De som van de cijfers van een getal vinden totdat de som één cijfer wordt </a> </h4> </div> </article> <!-- /ARTICLE --> <!-- ARTICLE --> <article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors"> <div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700"> <a href="/nl/sat-subject-test-math-1-vs-math-2-1311428"> <img src="https://techcodeview.com/img/blog/17/sat-subject-test-math-1-vs-math-2.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="SAT Subject Test Wiskunde 1 versus Wiskunde 2: welke moet ik nemen?" class="w-full h-full object-cover"> </a> </div> <div class="flex-1 min-w-0"> <h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug"> <a href="/nl/sat-subject-test-math-1-vs-math-2-1311428" class="hover:text-tech-500 transition-colors line-clamp-3">SAT Subject Test Wiskunde 1 versus Wiskunde 2: welke moet ik nemen? </a> </h4> </div> </article> <!-- /ARTICLE --> </div> <!-- Categories --> <div class="mt-8 mb-4 border-b border-slate-100 dark:border-slate-700 pb-2"> <h2 class="text-lg font-bold text-slate-900 dark:text-white uppercase tracking-wide">Categorie </h2> </div> <div class="flex flex-wrap gap-2"> <a href="/nl/blog/" class="inline-block px-3 py-1 bg-slate-100 dark:bg-slate-700 text-xs font-medium text-slate-600 dark:text-slate-300 rounded-full hover:bg-tech-500 hover:text-white transition-colors"> Bloggen </a> <a href="/nl/java-conversion/" class="inline-block px-3 py-1 bg-slate-100 dark:bg-slate-700 text-xs font-medium text-slate-600 dark:text-slate-300 rounded-full hover:bg-tech-500 hover:text-white transition-colors"> Java-Conversie </a> <a href="/nl/maths/" class="inline-block px-3 py-1 bg-slate-100 dark:bg-slate-700 text-xs font-medium text-slate-600 dark:text-slate-300 rounded-full hover:bg-tech-500 hover:text-white transition-colors"> Wiskunde </a> <a href="/nl/java-collections/" class="inline-block px-3 py-1 bg-slate-100 dark:bg-slate-700 text-xs font-medium text-slate-600 dark:text-slate-300 rounded-full hover:bg-tech-500 hover:text-white transition-colors"> Java-Collecties </a> <a href="/nl/differences/" class="inline-block px-3 py-1 bg-slate-100 dark:bg-slate-700 text-xs font-medium text-slate-600 dark:text-slate-300 rounded-full hover:bg-tech-500 hover:text-white transition-colors"> Verschillen </a> <a href="/nl/java-string/" class="inline-block px-3 py-1 bg-slate-100 dark:bg-slate-700 text-xs font-medium text-slate-600 dark:text-slate-300 rounded-full hover:bg-tech-500 hover:text-white transition-colors"> Java-Reeks </a> </div> <!-- Interesting Articles Widget --> <div class="mt-8"> <div class="mb-4 border-b border-slate-100 dark:border-slate-700 pb-2"> <h2 class="text-lg font-bold text-slate-900 dark:text-white uppercase tracking-wide">Interessante Artikelen </h2> </div> <div id="owl-carousel-4" class="owl-carousel owl-theme"> <!-- ARTICLE --> <article class="relative aspect-video rounded-lg overflow-hidden group mb-2"> <div class="absolute inset-0"> <img src="https://techcodeview.com/img/blog/10/27-best-liberal-arts-colleges-country.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="De 27 beste liberale kunstscholen van het land" class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500"> <div class="absolute inset-0 bg-gradient-to-t from-black/80 to-transparent"> </div> </div> <div class="absolute bottom-0 left-0 p-4"> <div class="text-xs text-tech-400 font-bold mb-1"> <a href="/nl/blog/">Bloggen </a> </div> <h4 class="text-sm font-bold text-white leading-tight"> <a href="/nl/27-best-liberal-arts-colleges-country-1311610">De 27 beste liberale kunstscholen van het land </a> </h4> </div> </article> <!-- /ARTICLE --> <!-- ARTICLE --> <article class="relative aspect-video rounded-lg overflow-hidden group mb-2"> <div class="absolute inset-0"> <img src="https://techcodeview.com/img/pc-tips/44/how-fix-horizontal-lines-computer-screen.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Hoe horizontale lijnen op een computerscherm te repareren?" class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500"> <div class="absolute inset-0 bg-gradient-to-t from-black/80 to-transparent"> </div> </div> <div class="absolute bottom-0 left-0 p-4"> <div class="text-xs text-tech-400 font-bold mb-1"> <a href="/nl/pc-tips/">Pc-Tips </a> </div> <h4 class="text-sm font-bold text-white leading-tight"> <a href="/nl/how-fix-horizontal-lines-computer-screen">Hoe horizontale lijnen op een computerscherm te repareren? </a> </h4> </div> </article> <!-- /ARTICLE --> <!-- ARTICLE --> <article class="relative aspect-video rounded-lg overflow-hidden group mb-2"> <div class="absolute inset-0"> <img src="https://techcodeview.com/img/java-tutorial/12/mvc-architecture-java.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="MVC-architectuur in Java" class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500"> <div class="absolute inset-0 bg-gradient-to-t from-black/80 to-transparent"> </div> </div> <div class="absolute bottom-0 left-0 p-4"> <div class="text-xs text-tech-400 font-bold mb-1"> <a href="/nl/java-tutorial/">Java-Zelfstudie </a> </div> <h4 class="text-sm font-bold text-white leading-tight"> <a href="/nl/mvc-architecture-java">MVC-architectuur in Java </a> </h4> </div> </article> <!-- /ARTICLE --> <!-- ARTICLE --> <article class="relative aspect-video rounded-lg overflow-hidden group mb-2"> <div class="absolute inset-0"> <img src="https://techcodeview.com/img/banking-english/73/canceled-cancelled-which-one-is-correct.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Geannuleerd of geannuleerd – welke is juist?" class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500"> <div class="absolute inset-0 bg-gradient-to-t from-black/80 to-transparent"> </div> </div> <div class="absolute bottom-0 left-0 p-4"> <div class="text-xs text-tech-400 font-bold mb-1"> <a href="/nl/banking-english/">Bankieren Engels </a> </div> <h4 class="text-sm font-bold text-white leading-tight"> <a href="/nl/canceled-cancelled-which-one-is-correct">Geannuleerd of geannuleerd – welke is juist? </a> </h4> </div> </article> <!-- /ARTICLE --> <!-- ARTICLE --> <article class="relative aspect-video rounded-lg overflow-hidden group mb-2"> <div class="absolute inset-0"> <img src="https://techcodeview.com/img/cloud-computing/54/advantages-disadvantages-cloud-computing.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Voor- en nadelen van cloudcomputing" class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500"> <div class="absolute inset-0 bg-gradient-to-t from-black/80 to-transparent"> </div> </div> <div class="absolute bottom-0 left-0 p-4"> <div class="text-xs text-tech-400 font-bold mb-1"> <a href="/nl/cloud-computing/">Cloud Computing </a> </div> <h4 class="text-sm font-bold text-white leading-tight"> <a href="/nl/advantages-disadvantages-cloud-computing">Voor- en nadelen van cloudcomputing </a> </h4> </div> </article> <!-- /ARTICLE --> <!-- ARTICLE --> <article class="relative aspect-video rounded-lg overflow-hidden group mb-2"> <div class="absolute inset-0"> <img src="https://techcodeview.com/img/computer-network/76/osi-model.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="OSI-model" class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500"> <div class="absolute inset-0 bg-gradient-to-t from-black/80 to-transparent"> </div> </div> <div class="absolute bottom-0 left-0 p-4"> <div class="text-xs text-tech-400 font-bold mb-1"> <a href="/nl/computer-network/">Computer Netwerk </a> </div> <h4 class="text-sm font-bold text-white leading-tight"> <a href="/nl/osi-model">OSI-model </a> </h4> </div> </article> <!-- /ARTICLE --> </div> </div> </div> </div> <!-- /Aside Column --> </div> </div> </div> <footer class="site-footer"> <div class="container"> <span class="footer-links"> Copyright ©2026 Alle Rechten Voorbehouden | <a href="//www.techcodeview.com/">techcodeview.com </a> | <a href="/disclaimer" rel="nofollow noopener noreferrer" target="_blank">Vrijwaring </a> | <a href="/about-us" rel="nofollow noopener noreferrer" target="_blank">Wie Zijn Wij? </a> | <a href="/privacy-policy" rel="nofollow noopener noreferrer" target="_blank">Privacybeleid </a> </span> </div> </footer> <script type="text/javascript" src="https://techcodeview.com/template/assets/plugins/jquery-1.11.3.min.js"> </script> <script type="text/javascript" src="https://techcodeview.com/template/assets/plugins/bootstrap/js/bootstrap.min.js"> </script> <script type="text/javascript" src="https://techcodeview.com/template/assets/js/main.js"> </script> <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.5.1/highlight.min.js"> </script> <script> !function(){"use strict";let t=document.createElement("button");t.id="toTopBtn",t.innerHTML="↑";let e=` #toTopBtn { position: fixed; bottom: 25px; right: 25px; z-index: 9999; opacity: 0; visibility: hidden; background-color: #0ea5e9; color: white; border: none; border-radius: 8px; width: 50px; height: 50px; font-size: 24px; cursor: pointer; transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out; } #toTopBtn:hover { background-color: #0284c7; } `,i=document.createElement("style");i.type="text/css",i.innerText=e,document.head.appendChild(i),document.body.appendChild(t),window.addEventListener("scroll",()=>{let e=window.scrollY||document.documentElement.scrollTop;e>300?(t.style.opacity="1",t.style.visibility="visible"):(t.style.opacity="0",t.style.visibility="hidden")}),t.addEventListener("click",()=>{window.scrollTo({top:0,behavior:"smooth"})})}(); </script> </body> </html>