XHTML alebo EXtensible HyperText Markup Language je mix HTML a XML, veľmi podobný HTML ale prísnejšie. Je to ako kniha pravidiel na vytváranie webových stránok, ktorým prehliadače ľahko porozumejú. Na rozdiel od HTML musíte byť opatrní a presne dodržiavať pravidlá. Väčšina prehliadačov to podporuje. Predstavte si to ako presnejší spôsob písania webového kódu.
Obsah
História
Bol vyvinutý konzorciom World Wide Web Consortium (W3C) a pomáha webovým vývojárom pri prechode z HTML na XML. Pomocou XHTML môžu vývojári vstúpiť do sveta XML so všetkými jeho funkciami a zároveň zabezpečiť spätnú a budúcu kompatibilitu obsahu. Rodina XHTML zahŕňa tri typy dokumentov; prvou je XHTML 1.0, ktorá bola odporúčaná W3C 26. januára 2000. Druhá je XHTML 1.1, ktorú W3C odporučila 31. mája 2001.
Tretím je XHTML5, štandard používaný na vývoj prispôsobenia XML špecifikácie HTML5. Dokument XHTML musí mať deklaráciu XHTML.
Prvky XHTML:
| Prvok XHTML | Popis |
> | Používa sa na deklarovanie definície typu dokumentu (DTD), ktorá určuje pravidlá pre značkovací jazyk a zabezpečuje správne vykresľovanie v prehliadačoch. |
> | Uzatvára celý dokument HTML alebo XHTML, ktorý slúži ako koreňový prvok. |
> | Obsahuje metainformácie o dokumente, ako je názov, znaková sada, prepojené šablóny so štýlmi a ďalšie dôležité prvky. |
> | Vnorený do sekcie head určuje názov dokumentu, ktorý sa zobrazuje v záhlaví alebo na karte prehliadača. |
> | Uzatvára obsah webovej stránky vrátane textu, obrázkov, odkazov a iných prvkov HTML. Predstavuje viditeľnú časť dokumentu zobrazenú v prehliadači. |
Pri vytváraní XHTML webovej stránky je potrebné zahrnúť deklaráciu DTD (Document Type Definition). Existujú tri typy DTD, o ktorých sa hovorí nižšie:
Prechodné DTD:
Podporujú ho staršie prehliadače, ktoré nemajú vstavanú podporu kaskádových štýlov. V značke tela je uzavretých niekoľko atribútov, ktoré nie sú povolené v striktnej DTD.
Syntax:
PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN' 'DTD/xhtml1-transitional.dtd'>
Príklad: V tomto príklade uvidíme kód na písanie XHTML dokumentu s príkladom.
html
xml version='1.0' encoding='UTF-8'?> Prechodné DTD XHTMLtitle> hlava> <body bgcolor='#dae1ed'> <div>font-weight:bold;text-align:center; margin-bottom:-25px;'>techcodeview.comdiv> <p style='text-align:center;font-size:20px;'>Portál počítačovej vedy <p style='text-align:center;font-size:20px;'>Možnosť výberu mesiaca: <select name='month'> <option selected='selected'>Možnosť januára> <option>Februárová možnosť> <option>Marchoption> <option>Apriloption> <option>Mayoption> <option>Možnosť júna> <option>júlová možnosť> <option>Augusyopcia> <option>Možnosť septembra> <option>Októbrová možnosť> <option>Novembrová možnosť> <option>Decemberoption> select> 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>Výkon: </strong> </b> </p> <p> <img src='//techcodeview.com/img/html-xml/79/xhtml-introduction.webp' alt='prechodné dtd xhtml'> <span> </span> </p> <h2 id='strict-dtd'> <b> <strong>Prísne DTD: </strong> </b> <span> </span> </h2> <p dir='ltr'> <span>Striktné DTD sa používa, keď stránka XHTML obsahuje iba značkovací jazyk. Strict DTD sa používa spolu s kaskádovými štýlmi, pretože tento atribút neumožňuje vlastnosť CSS v značke body. </span> </p> <h3> <b> <strong>Syntax: </strong> </b> </h3> <pre> PUBLIC '-//W3C//DTD XHTML 1.0 Strict//EN' 'DTD/xhtml1-strict.dtd'> </pre> <p dir='ltr'> <b> <strong>Príklad 2: </strong> </b> <span>V tomto príklade uvidíme kód na písanie XHTML dokumentu s príkladom pre striktné 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>Prísne DTD XHTMLtitle> head> <body> <div>font-weight:bold;text-align:center; margin-bottom:-25px;'>techcodeview.comdiv> <p style='text-align:center;font-size:20px;'>Portál počítačovej vedy <p style='text-align:center;font-size:20px;'>Možnosť výberu mesiaca: <select name='month'> <option selected='selected'>Možnosť januára> <option>Februárová možnosť> <option>Marchoption> <option>Apriloption> <option>Mayoption> <option>Možnosť júna> <option>júlová možnosť> <option>Augusyopcia> <option>Možnosť septembra> <option>Októbrová možnosť> <option>Novembrová možnosť> <option>Decemberoption> select> 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>Výkon: </strong> </b> </p> <p> <span> </span> <img src='//techcodeview.com/img/html-xml/79/xhtml-introduction-2.webp' alt='prísne dtd xhtml'> <span> </span> </p> <h2 id='frameset-dtd'> <b> <strong>Sada rámov DTD: </strong> </b> <span> </span> </h2> <p dir='ltr'> <span>Sada rámcov DTD sa používa, keď stránka XHTML obsahuje snímky. Toto DTD je identické s HTML 4.01 Transitional DTD s výnimkou modelu obsahu prvku HTML. </span> </p> <h3> <b> <strong>Syntax: </strong> </b> </h3> <pre> PUBLIC '-//W3C//DTD XHTML 1.0 Frameset//EN' 'DTD/xhtml1-frameset.dtd'> </pre> <p dir='ltr'> <b> <strong>Príklad 2: </strong> </b> <span>V tomto príklade uvidíme kód na písanie XHTML dokumentu s príkladom pre 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>Sada rámov DTD XHTMLtitle> head> <frameset cols='30%, 20%, *'> <frameset rows='40%, 30%, *'> <frame src='gfg.html' /> <frame src='gfg1.html' /> <frame src='geeks.html' />sada rámov> <frameset rows='40%, 60%'> <frame src='g4g.html' /> <frame src='g4g1.html' />sada rámov> <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>Výkon: </strong> </b> </p> <h2 id='why-use-xhtml'> <img src='//techcodeview.com/img/html-xml/79/xhtml-introduction-3.webp' alt='frameset dtd xhtml'> <b> <strong>Prečo používať XHTML? </strong> </b> </h2> <ul> <li value='1'> <span>Dokumenty XHTML sú overené štandardnými nástrojmi XML. </span> </li> <li value='2'> <span>Je ľahké udržiavať, konvertovať a upravovať dokument z dlhodobého hľadiska. </span> </li> <li value='3'> <span>Používa sa na definovanie štandardu kvality webových stránok. </span> </li> <li value='4'> <span>XHTML je oficiálny štandard W3C, vaša webová stránka sa stáva kompatibilnejšou a presnejšou s mnohými prehliadačmi. </span> </li> </ul> <h2 id='benefits-of-xhtml'> <b> <strong>Výhody XHTML: </strong> </b> </h2> <ul> <li value='1'> <span>Všetky značky XHTML musia mať uzatváracie značky a sú správne vnorené. Tým sa vygeneruje čistejší kód. </span> </li> <li value='2'> <span>Dokumenty XHTML sú štíhle, čo znamená, že využívajú menšiu šírku pásma. To znižuje náklady, najmä ak má váš web 1000 stránok. </span> </li> <li value='3'> <span>Dokumenty XHTML sú dobre naformátované a dobre tvarované a možno ich jednoducho preniesť do bezdrôtových zariadení, čítačiek Braillovho písma a iných špecializovaných webových prostredí. </span> </li> <li value='4'> <span>Všetky novinky budú v XML (ktorého XHTML je aplikácia). </span> </li> <li value='5'> <span>XHTML spolupracuje s CSS na vytváraní webových stránok, ktoré možno ľahko aktualizovať. </span> </li> </ul> <h2 id='difference-between-html-and-xhtml'> <b> <strong>Rozdiel medzi HTML a 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 alebo HyperText Markup Language je hlavný značkovací jazyk na vytváranie webových stránok </span> </td> <td> <span>XHTML (Extensible HyperText Markup Language) je rodina značkovacích jazykov XML, ktoré odrážajú alebo rozširujú verzie široko používaného jazyka HTML (Hypertext Markup Language) </span> </td> </tr> <tr> <td> <span>Flexibilný rámec vyžadujúci zhovievavý analyzátor špecifický pre HTML </span> </td> <td> <span>Reštriktívna podmnožina XML, ktorú je potrebné analyzovať pomocou štandardných analyzátorov XML </span> </td> </tr> <tr> <td> <span>Navrhol Tim Berners-Lee v roku 1987 </span> </td> <td> <span>Odporúčanie konzorcia World Wide Web z roku 2000. </span> </td> </tr> <tr> <td> <span>Aplikácia štandardného zovšeobecneného značkovacieho jazyka (SGML). </span> </td> <td> <span>Aplikácia XML </span> </td> </tr> <tr> <td> <span>Rozšírené z SGML. </span> </td> <td> <span>Rozšírené z 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>
Zdieľať </h4>
<div class="flex flex-wrap justify-center gap-3">
<!-- Twitter -->
<a href="https://twitter.com/intent/tweet?text=Úvod do XHTML&url=https://www.techcodeview.com/sk/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/sk/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/sk/xhtml-introduction&title=Úvod do XHTML"
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">
Mohlo By Sa Vám Páčiť </h3>
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
<div class="group">
<a href="/sk/static-function-java" 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/java-tutorial/50/static-function-java.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Statická funkcia v Jave" 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="/sk/static-function-java">Statická funkcia v Jave </a>
</h4>
</div> <div class="group">
<a href="/sk/java-architecture" 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/java-tutorial/31/java-architecture.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Architektúra Java" 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="/sk/java-architecture">Architektúra Java </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>
Najlepšie Články </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="/sk/resource-allocation-graph">
<img src="https://techcodeview.com/img/operating-system/37/resource-allocation-graph.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Graf prideľovania zdrojov" 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="/sk/resource-allocation-graph" class="hover:text-tech-500 transition-colors line-clamp-3">Graf prideľovania zdrojov </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="/sk/how-subtract-excel">
<img src="https://techcodeview.com/img/ms-excel-tutorial/29/how-subtract-excel.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Ako odčítať v exceli" 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="/sk/how-subtract-excel" class="hover:text-tech-500 transition-colors line-clamp-3">Ako odčítať v exceli </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="/sk/heart-algebra-key-strategies-1311146">
<img src="https://techcodeview.com/img/blog/67/heart-algebra-key-strategies.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Srdce algebry: Kľúčové stratégie pre SAT matematiku" 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="/sk/heart-algebra-key-strategies-1311146" class="hover:text-tech-500 transition-colors line-clamp-3">Srdce algebry: Kľúčové stratégie pre SAT matematiku </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="/sk/java-main-method">
<img src="https://techcodeview.com/img/java-misc/23/java-main-method.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Java main() metóda" 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="/sk/java-main-method" class="hover:text-tech-500 transition-colors line-clamp-3">Java main() metóda </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="/sk/java-annotations">
<img src="https://techcodeview.com/img/java-new-features/05/java-annotations.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Java anotácie" 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="/sk/java-annotations" class="hover:text-tech-500 transition-colors line-clamp-3">Java anotácie </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="/sk/apache-groovy-tutorial">
<img src="https://techcodeview.com/img/groovy-tutorial/84/apache-groovy-tutorial.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Návod Apache Groovy" 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="/sk/apache-groovy-tutorial" class="hover:text-tech-500 transition-colors line-clamp-3">Návod Apache Groovy </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="/sk/convert-given-time-into-words">
<img src="https://techcodeview.com/img/misc/28/convert-given-time-into-words.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Premeňte daný čas na slová" 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="/sk/convert-given-time-into-words" class="hover:text-tech-500 transition-colors line-clamp-3">Premeňte daný čas na slová </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="/sk/advantages-disadvantages-cloud-computing">
<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="Výhody a nevýhody cloud computingu" 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="/sk/advantages-disadvantages-cloud-computing" class="hover:text-tech-500 transition-colors line-clamp-3">Výhody a nevýhody cloud computingu </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="/sk/how-delete-filtered-rows-excel">
<img src="https://techcodeview.com/img/excel-functions/66/how-delete-filtered-rows-excel.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Ako odstrániť filtrované riadky v Exceli" 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="/sk/how-delete-filtered-rows-excel" class="hover:text-tech-500 transition-colors line-clamp-3">Ako odstrániť filtrované riadky v Exceli </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="/sk/reactjs-setstate">
<img src="https://techcodeview.com/img/picked/04/reactjs-setstate.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="ReactJS setState()" 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="/sk/reactjs-setstate" class="hover:text-tech-500 transition-colors line-clamp-3">ReactJS setState() </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">Kategórie </h2>
</div>
<div class="flex flex-wrap gap-2">
<a href="/sk/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">
Blog
</a> <a href="/sk/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">
Konverzia Java
</a> <a href="/sk/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">
Matematika
</a> <a href="/sk/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">
Kolekcie Java
</a> <a href="/sk/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">
Rozdiely
</a> <a href="/sk/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 Reťazec
</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">Zaujímavé Články </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/19/best-summary-analysis.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Najlepšie zhrnutie a analýza: Veľký Gatsby, kapitola 6" 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="/sk/blog/">Blog </a> </div>
<h4 class="text-sm font-bold text-white leading-tight"> <a href="/sk/best-summary-analysis-1311272">Najlepšie zhrnutie a analýza: Veľký Gatsby, kapitola 6 </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/digital-electronics/56/de-multiplexer.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="De-multiplexor" 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="/sk/digital-electronics/">Digitálna Elektronika </a> </div>
<h4 class="text-sm font-bold text-white leading-tight"> <a href="/sk/de-multiplexer">De-multiplexor </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/cpp-array/98/c-multidimensional-array.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="C++ viacrozmerné pole" 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="/sk/cpp-array/">Cpp-Pole </a> </div>
<h4 class="text-sm font-bold text-white leading-tight"> <a href="/sk/c-multidimensional-array">C++ viacrozmerné pole </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/blog/54/complete-list-high-school-sports.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Kompletný zoznam stredoškolských športov: Ako si vybrať" 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="/sk/blog/">Blog </a> </div>
<h4 class="text-sm font-bold text-white leading-tight"> <a href="/sk/complete-list-high-school-sports-1311234">Kompletný zoznam stredoškolských športov: Ako si vybrať </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/blog/59/how-get-into-west-point.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Ako sa dostať do West Point: 3 kľúčové tipy" 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="/sk/blog/">Blog </a> </div>
<h4 class="text-sm font-bold text-white leading-tight"> <a href="/sk/how-get-into-west-point-1311156">Ako sa dostať do West Point: 3 kľúčové tipy </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/web-technologies/11/what-is-an-api.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Čo je API (Application Programming Interface)" 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="/sk/web-technologies/">Webové Technológie </a> </div>
<h4 class="text-sm font-bold text-white leading-tight"> <a href="/sk/what-is-an-api">Čo je API (Application Programming Interface) </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 Všetky Práva Vyhradené |
<a href="//www.techcodeview.com/">techcodeview.com </a> |
<a href="/disclaimer" rel="nofollow noopener noreferrer" target="_blank">Odmietnutie Zodpovednosti </a> |
<a href="/about-us" rel="nofollow noopener noreferrer" target="_blank">O Nás </a> |
<a href="/privacy-policy" rel="nofollow noopener noreferrer" target="_blank">Zásady Ochrany Osobných Údajov </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>
|
