XHTML ou Langage de balisage hypertexte extensible est un mélange de HTML et XML, très similaire à HTML mais plus strict. C’est comme un livre de règles pour créer des pages Web que les navigateurs comprennent facilement. Contrairement au HTML, vous devez être prudent et suivre exactement les règles. La plupart des navigateurs le prennent en charge. Considérez-le simplement comme une manière plus précise d’écrire du code Web.
Table des matières
Histoire
Il a été développé par le World Wide Web Consortium (W3C) et aide les développeurs Web à passer du HTML au XML. Avec XHTML, les développeurs peuvent entrer dans le monde XML avec toutes ses fonctionnalités tout en garantissant la compatibilité ascendante et future du contenu. La famille XHTML comprend trois types de documents ; le premier est XHTML 1.0, recommandé par le W3C le 26 janvier 2000. Le second est XHTML 1.1, recommandé par le W3C le 31 mai 2001.
Le troisième est XHTML5, un standard utilisé pour développer une adaptation XML de la spécification HTML5. Un document XHTML doit avoir une déclaration XHTML.
Éléments de XHTML :
| Élément XHTML | Description |
> | Utilisé pour déclarer la définition de type de document (DTD), spécifiant les règles du langage de balisage, garantissant un rendu correct dans les navigateurs. |
> | Entoure l'intégralité du document HTML ou XHTML, servant d'élément racine. |
> | Contient des méta-informations sur le document, telles que le titre, le jeu de caractères, les feuilles de style liées et d'autres éléments essentiels. |
> | Imbriqué dans la section d'en-tête, spécifie le titre du document, affiché dans la barre de titre ou l'onglet du navigateur. |
> | Entoure le contenu de la page Web, y compris le texte, les images, les liens et autres éléments HTML. Il représente la partie visible du document affiché dans le navigateur. |
Lors de la création d'une page Web XHTML, il est nécessaire d'inclure une déclaration DTD (Document Type Definition). Il existe trois types de DTD qui sont décrits ci-dessous :
DTD de transition :
Il est pris en charge par les anciens navigateurs qui ne disposent pas de prise en charge intégrée des feuilles de style en cascade. Plusieurs attributs sont inclus dans la balise body et ne sont pas autorisés dans une DTD stricte.
Syntaxe:
PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN' 'DTD/xhtml1-transitional.dtd'>
Exemple: Dans cet exemple nous verrons le code pour écrire un document XHTML avec un exemple.
HTML
xml version='1.0' encoding='UTF-8'?> Titre XHTML DTD transitionnel> tête> <body bgcolor='#dae1ed'> <div>font-weight: gras; texte-align: center; margin-bottom:-25px;'>techcodeview.comdiv> <p style='text-align:center;font-size:20px;'>Un portail informatique <p style='text-align:center;font-size:20px;'>Possibilité de choisir le mois : <select name='month'> <option selected='selected'>Option janvier> <option>Option février> <option>Option mars> <option>Option avril> <option>Option mai> <option>Option juin> <option>Option juillet> <option>Option Augusy> <option>Option septembre> <option>Option octobre> <option>Option novembre> <option>Option décembre> 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>Sortir: </strong> </b> </p> <p> <img src='//techcodeview.com/img/html-xml/79/xhtml-introduction.webp' alt='transitionnel dtd xhtml'> <span> </span> </p> <h2 id='strict-dtd'> <b> <strong>DTD stricte : </strong> </b> <span> </span> </h2> <p dir='ltr'> <span>La DTD stricte est utilisée lorsque la page XHTML contient uniquement un langage de balisage. La DTD stricte est utilisée avec les feuilles de style en cascade, car cet attribut n'autorise pas la propriété CSS dans la balise body. </span> </p> <h3> <b> <strong>Syntaxe: </strong> </b> </h3> <pre> PUBLIC '-//W3C//DTD XHTML 1.0 Strict//EN' 'DTD/xhtml1-strict.dtd'> </pre> <p dir='ltr'> <b> <strong>Exemple 2 : </strong> </b> <span>Dans cet exemple nous verrons le code pour écrire un document XHTML avec un exemple de DTD stricte. </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>Titre XHTML DTD strict> tête> <body> <div>font-weight: gras; texte-align: center; margin-bottom:-25px;'>techcodeview.comdiv> <p style='text-align:center;font-size:20px;'>Un portail informatique <p style='text-align:center;font-size:20px;'>Possibilité de choisir le mois : <select name='month'> <option selected='selected'>Option janvier> <option>Option février> <option>Option mars> <option>Option avril> <option>Option mai> <option>Option juin> <option>Option juillet> <option>Option Augusy> <option>Option septembre> <option>Option octobre> <option>Option novembre> <option>Option décembre> 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>Sortir: </strong> </b> </p> <p> <span> </span> <img src='//techcodeview.com/img/html-xml/79/xhtml-introduction-2.webp' alt='dtd strict xhtml'> <span> </span> </p> <h2 id='frameset-dtd'> <b> <strong>DTD du jeu de cadres : </strong> </b> <span> </span> </h2> <p dir='ltr'> <span>La DTD frameset est utilisée lorsque la page XHTML contient des frames. Cette DTD est identique à la DTD transitionnelle HTML 4.01, à l'exception du modèle de contenu de l'élément HTML. </span> </p> <h3> <b> <strong>Syntaxe: </strong> </b> </h3> <pre> PUBLIC '-//W3C//DTD XHTML 1.0 Frameset//EN' 'DTD/xhtml1-frameset.dtd'> </pre> <p dir='ltr'> <b> <strong>Exemple 2 : </strong> </b> <span>Dans cet exemple, nous verrons le code pour écrire un document XHTML avec un exemple de DTD frameset. </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 XHTMLtitre> tête> <frameset cols='30%, 20%, *'> <frameset rows='40%, 30%, *'> <frame src='gfg.html' /> <frame src='gfg1.html' /> <frame src='geeks.html' />jeu de cadres> <frameset rows='40%, 60%'> <frame src='g4g.html' /> <frame src='g4g1.html' />jeu de cadres> <frameset rows='20%, 20%, 30%, *'> <frame src='geeksforgeeks.html' /> <frame src='geeksforgeeks1.html' /> <frame src='geeksforgeeks2.html' /> <frame src='geeksforgeeks3.html' />jeu de cadres> jeu de cadres> 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>Sortir: </strong> </b> </p> <h2 id='why-use-xhtml'> <img src='//techcodeview.com/img/html-xml/79/xhtml-introduction-3.webp' alt='jeu de cadres dtd xhtml'> <b> <strong>Pourquoi utiliser XHTML ? </strong> </b> </h2> <ul> <li value='1'> <span>Les documents XHTML sont validés avec des outils XML standards. </span> </li> <li value='2'> <span>Il est facile de maintenir, convertir, modifier un document à long terme. </span> </li> <li value='3'> <span>Il est utilisé pour définir le standard de qualité des pages Web. </span> </li> <li value='4'> <span>XHTML est un standard officiel du W3C, votre site Web devient plus compatible et plus précis avec de nombreux navigateurs. </span> </li> </ul> <h2 id='benefits-of-xhtml'> <b> <strong>Avantages du XHTML : </strong> </b> </h2> <ul> <li value='1'> <span>Toutes les balises XHTML doivent avoir des balises de fermeture et sont correctement imbriquées. Cela génère un code plus propre. </span> </li> <li value='2'> <span>Les documents XHTML sont légers, ce qui signifie qu'ils utilisent moins de bande passante. Cela réduit les coûts, en particulier si votre site Web comporte des milliers de pages. </span> </li> <li value='3'> <span>Les documents XHTML sont bien formatés et peuvent facilement être transportés vers des appareils sans fil, des lecteurs braille et d'autres environnements Web spécialisés. </span> </li> <li value='4'> <span>Tous les nouveaux développements seront en XML (dont XHTML est une application). </span> </li> <li value='5'> <span>XHTML fonctionne en association avec CSS pour créer des pages Web qui peuvent facilement être mises à jour. </span> </li> </ul> <h2 id='difference-between-html-and-xhtml'> <b> <strong>Différence entre HTML et 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 ou HyperText Markup Language est le principal langage de balisage pour la création de pages Web. </span> </td> <td> <span>XHTML (Extensible HyperText Markup Language) est une famille de langages de balisage XML qui reflètent ou étendent les versions du langage HTML (Hypertext Markup Language) largement utilisé. </span> </td> </tr> <tr> <td> <span>Cadre flexible nécessitant un analyseur spécifique au HTML indulgent </span> </td> <td> <span>Sous-ensemble restrictif de XML qui doit être analysé avec des analyseurs XML standard </span> </td> </tr> <tr> <td> <span>Proposé par Tim Berners-Lee en 1987 </span> </td> <td> <span>Recommandation du Consortium World Wide Web en 2000. </span> </td> </tr> <tr> <td> <span>Application du langage de balisage standard généralisé (SGML). </span> </td> <td> <span>Application de XML </span> </td> </tr> <tr> <td> <span>Étendu à partir de SGML. </span> </td> <td> <span>Étendu à partir de 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>
Partager </h4>
<div class="flex flex-wrap justify-center gap-3">
<!-- Twitter -->
<a href="https://twitter.com/intent/tweet?text=Présentation du XHTML&url=https://www.techcodeview.com/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/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/xhtml-introduction&title=Présentation du 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">
Vous Pourriez Aimer </h3>
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
<div class="group">
<a href="/memory-management-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-misc/33/memory-management-java.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Gestion de la mémoire en 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="/memory-management-java">Gestion de la mémoire en Java </a>
</h4>
</div> <div class="group">
<a href="/how-git-undo-last-commit" 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/blog/57/how-git-undo-last-commit.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Comment annuler le dernier commit" 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="/how-git-undo-last-commit">Comment annuler le dernier commit </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 Articles </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="/what-is-formula">
<img src="https://techcodeview.com/img/maths-formulas/90/what-is-formula.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Quelle est la formule pour trouver des angles ?" 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="/what-is-formula" class="hover:text-tech-500 transition-colors line-clamp-3">Quelle est la formule pour trouver des angles ? </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="/booting-operating-system">
<img src="https://techcodeview.com/img/operating-system/96/booting-operating-system.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Démarrage dans le système d'exploitation" 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="/booting-operating-system" class="hover:text-tech-500 transition-colors line-clamp-3">Démarrage dans le système d'exploitation </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="/ml-expectation-maximization-algorithm">
<img src="https://techcodeview.com/img/it-problems-solutions/33/ml-expectation-maximization-algorithm.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="ML | Algorithme d’attente-maximisation" 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="/ml-expectation-maximization-algorithm" class="hover:text-tech-500 transition-colors line-clamp-3">ML | Algorithme d’attente-maximisation </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="/how-read-manual-pages-linux-man-command">
<img src="https://techcodeview.com/img/linux-command/35/how-read-manual-pages-linux-man-command.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Comment lire les pages de manuel sous Linux | homme commande" 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="/how-read-manual-pages-linux-man-command" class="hover:text-tech-500 transition-colors line-clamp-3">Comment lire les pages de manuel sous Linux | homme commande </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="/file-operations-java">
<img src="https://techcodeview.com/img/java-tutorial/84/file-operations-java.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Opérations sur les fichiers en Java" 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="/file-operations-java" class="hover:text-tech-500 transition-colors line-clamp-3">Opérations sur les fichiers en Java </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="/what-is-main-c">
<img src="https://techcodeview.com/img/c-tutorial/79/what-is-main-c.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Quelle est la principale en C ?" 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="/what-is-main-c" class="hover:text-tech-500 transition-colors line-clamp-3">Quelle est la principale en C ? </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="/user-defined-function-c">
<img src="https://techcodeview.com/img/it-problems-solutions/21/user-defined-function-c.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Fonction définie par l'utilisateur en C" 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="/user-defined-function-c" class="hover:text-tech-500 transition-colors line-clamp-3">Fonction définie par l'utilisateur en C </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="/9-sat-grammar-rules-you-must-know-131714">
<img src="https://techcodeview.com/img/blog/14/9-sat-grammar-rules-you-must-know.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Les 9 règles de grammaire SAT que vous devez connaître" 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="/9-sat-grammar-rules-you-must-know-131714" class="hover:text-tech-500 transition-colors line-clamp-3">Les 9 règles de grammaire SAT que vous devez connaître </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="/difference-between-quad-core">
<img src="https://techcodeview.com/img/it-problems-solutions/66/difference-between-quad-core.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Différence entre les processeurs Quad Core et Octa Core" 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="/difference-between-quad-core" class="hover:text-tech-500 transition-colors line-clamp-3">Différence entre les processeurs Quad Core et Octa Core </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="/how-access-icloud-photos-android">
<img src="https://techcodeview.com/img/android-tutorial/70/how-access-icloud-photos-android.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Comment accéder aux photos iCloud sur Android" 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="/how-access-icloud-photos-android" class="hover:text-tech-500 transition-colors line-clamp-3">Comment accéder aux photos iCloud sur Android </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">Catégorie </h2>
</div>
<div class="flex flex-wrap gap-2">
<a href="/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="/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">
Conversion Java
</a> <a href="/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">
Mathématiques
</a> <a href="/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">
Collections Java
</a> <a href="/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">
Différences
</a> <a href="/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">
Chaîne Java
</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">Des Articles Intéressants </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/math-concepts/43/decimal-binary-converter.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Convertisseur décimal en binaire" 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="/math-concepts/">Concepts Mathématiques </a> </div>
<h4 class="text-sm font-bold text-white leading-tight"> <a href="/decimal-binary-converter">Convertisseur décimal en binaire </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/it-problems-solutions/94/supervised-unsupervised-learning.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Apprentissage supervisé et non supervisé" 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="/it-problems-solutions/">Problèmes Informatiques Et Solutions </a> </div>
<h4 class="text-sm font-bold text-white leading-tight"> <a href="/supervised-unsupervised-learning">Apprentissage supervisé et non supervisé </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/android-tutorial/15/how-recover-deleted-videos-from-android.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Comment récupérer des vidéos supprimées d'Android" 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="/android-tutorial/">Tutoriel Android </a> </div>
<h4 class="text-sm font-bold text-white leading-tight"> <a href="/how-recover-deleted-videos-from-android">Comment récupérer des vidéos supprimées d'Android </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/97/what-is-an-honors-college.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Qu'est-ce qu'un collège spécialisé? Devriez-vous vous inscrire à l’un d’entre eux ?" 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="/blog/">Blog </a> </div>
<h4 class="text-sm font-bold text-white leading-tight"> <a href="/what-is-an-honors-college-1311220">Qu'est-ce qu'un collège spécialisé? Devriez-vous vous inscrire à l’un d’entre eux ? </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/ms-excel-tutorial/09/6-methods-put-tick-symbol-microsoft-excel.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="6 méthodes pour mettre le symbole de coche dans Microsoft Excel" 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="/ms-excel-tutorial/">Tutoriel Ms Excel </a> </div>
<h4 class="text-sm font-bold text-white leading-tight"> <a href="/6-methods-put-tick-symbol-microsoft-excel">6 méthodes pour mettre le symbole de coche dans Microsoft Excel </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/automata-tutorial/15/transition-table.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Tableau de transition" 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="/automata-tutorial/">Tutoriel Automatique </a> </div>
<h4 class="text-sm font-bold text-white leading-tight"> <a href="/transition-table">Tableau de transition </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 Tous Les Droits Sont Réservés |
<a href="//www.techcodeview.com/sl/">techcodeview.com </a> |
<a href="/disclaimer" rel="nofollow noopener noreferrer" target="_blank">Clause De Non-Responsabilité </a> |
<a href="/about-us" rel="nofollow noopener noreferrer" target="_blank">A Propos De Nous </a> |
<a href="/privacy-policy" rel="nofollow noopener noreferrer" target="_blank">Politique De Confidentialité </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>
|
