INTRODUCCIÓ A XHTML - TECHCODEVIEW.COM

XHTML o Llenguatge de marcat d'hipertext extensible és una barreja d'HTML i XML, molt semblant a HTML però més estricte. És com un llibre de regles per crear pàgines web que els navegadors entenguin fàcilment. A diferència d'HTML, cal anar amb compte i seguir les regles exactament. La majoria de navegadors ho admeten. Penseu-hi com una manera més precisa d'escriure codi web.

Taula de contingut

Història
DTD de transició
DTD estricte
Frameset DTD
Per què utilitzar XHTML?
Beneficis de XHTML
Diferència entre HTML i XHTML

Història

Va ser desenvolupat pel World Wide Web Consortium (W3C) i ajuda els desenvolupadors web a passar d'HTML a XML. Amb XHTML, els desenvolupadors poden entrar al món XML amb totes les seves característiques, alhora que garanteixen la compatibilitat enrere i futura del contingut. La família XHTML inclou tres tipus de document; el primer és XHTML 1.0, que va ser recomanat pel W3C el 26 de gener de 2000. El segon és XHTML 1.1, que va ser recomanat pel W3C el 31 de maig de 2001.

El tercer és XHTML5, un estàndard utilitzat per desenvolupar una adaptació XML de l'especificació HTML5. Un document XHTML ha de tenir una declaració XHTML.

Elements de XHTML:

Element XHTML	Descripció
`>`	S'utilitza per declarar la definició del tipus de document (DTD), especificant les regles del llenguatge de marques, garantint la representació correcta als navegadors.
`>`	Inclou tot el document HTML o XHTML, que serveix com a element arrel.
`>`	Conté metainformació sobre el document, com ara el títol, el conjunt de caràcters, els fulls d'estil enllaçats i altres elements essencials.
`>`	Imbricat dins de la secció de capçalera, especifica el títol del document, que es mostra a la barra o pestanya de títol del navegador.
`>`	Inclou el contingut de la pàgina web, incloent text, imatges, enllaços i altres elements HTML. Representa la part visible del document que es mostra al navegador.

Quan es crea una pàgina web XHTML, és necessari incloure una declaració DTD (Document Type Definition). Hi ha tres tipus de DTD que es discuteixen a continuació:

DTD de transició:

És compatible amb els navegadors més antics que no tenen suports integrats per a fulls d'estil en cascada. A l'etiqueta del cos s'inclouen diversos atributs que no es permeten en un DTD estricte.

Sintaxi:

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

Exemple: En aquest exemple veurem el codi per escriure un document XHTML amb un exemple.

html

xml version='1.0' encoding='UTF-8'?>        DTD de transició XHTMLtitle> cap> <body bgcolor='#dae1ed'>   <div>font-weight:bold;text-align:center;  margin-bottom:-25px;'>techcodeview.comdiv> <p style='text-align:center;font-size:20px;'>Un portal informàtic p> <p style='text-align:center;font-size:20px;'>Opció per triar mes: <select name='month'>   <option selected='selected'>Opció de gener> <option>opció febrer> <option>opció de març> <option>Opció d'abril> <option>Opció de maig> <option>Opció de juny> <option>opció de juliol> <option>Augusyoption> <option>Opció setembre> <option>Opció d'octubre> <option>Opció de novembre> <option>Opció de desembre> seleccionar> p> cos> 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>Sortida: </strong>  </b>  </p>  <p> <img src='//techcodeview.com/img/html-xml/79/xhtml-introduction.webp' alt='transició dtd xhtml'> <span>  </span> </p>  <h2 id='strict-dtd'>  <b>  <strong>DTD estricte: </strong>  </b>  <span>  </span> </h2>  <p dir='ltr'> <span>El DTD estricte s'utilitza quan la pàgina XHTML només conté llenguatge de marques. El DTD estricte s'utilitza juntament amb els fulls d'estil en cascada, perquè aquest atribut no permet la propietat CSS a l'etiqueta del cos. </span> </p>  <h3>  <b>  <strong>Sintaxi: </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>En aquest exemple veurem el codi per escriure un document XHTML amb un exemple de DTD estricte. </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>Estricte DTD XHTMLtitle> cap> <body>   <div>font-weight:bold;text-align:center;  margin-bottom:-25px;'>techcodeview.comdiv> <p style='text-align:center;font-size:20px;'>Un portal informàtic p> <p style='text-align:center;font-size:20px;'>Opció per triar mes: <select name='month'>   <option selected='selected'>Opció de gener> <option>opció febrer> <option>opció de març> <option>Opció d'abril> <option>Opció de maig> <option>Opció de juny> <option>opció de juliol> <option>Augusyoption> <option>Opció setembre> <option>Opció d'octubre> <option>Opció de novembre> <option>Opció de desembre> seleccionar> p> cos> 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>Sortida: </strong>  </b>  </p>  <p> <span>  </span> <img src='//techcodeview.com/img/html-xml/79/xhtml-introduction-2.webp' alt='estricte dtd xhtml'> <span>  </span> </p>  <h2 id='frameset-dtd'>  <b>  <strong>Frameset DTD: </strong>  </b>  <span>  </span> </h2>  <p dir='ltr'> <span>El conjunt de marcs DTD s'utilitza quan la pàgina XHTML conté marcs. Aquesta DTD és idèntica a la DTD de transició HTML 4.01 excepte pel model de contingut de l'element HTML. </span> </p>  <h3>  <b>  <strong>Sintaxi: </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>En aquest exemple veurem el codi per escriure un document XHTML amb un exemple per a DTD de 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 XHTMLtitle> cap> <frameset cols='30%, 20%, *'>   <frameset rows='40%, 30%, *'>   <frame src='gfg.html' />   <frame src='gfg1.html' />   <frame src='geeks.html' />conjunt de marcs> <frameset rows='40%, 60%'>   <frame src='g4g.html' />   <frame src='g4g1.html' />conjunt de marcs> <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>Sortida: </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>Per què utilitzar XHTML? </strong>  </b>  </h2>  <ul>  <li value='1'> <span>Els documents XHTML es validen amb eines XML estàndard. </span> </li>  <li value='2'> <span>És fàcil de mantenir, convertir i editar un document a llarg termini. </span> </li>  <li value='3'> <span>S'utilitza per definir l'estàndard de qualitat de les pàgines web. </span> </li>  <li value='4'> <span>XHTML és un estàndard oficial del W3C, el vostre lloc web es fa més compatible i precís amb molts navegadors. </span> </li>  </ul>  <h2 id='benefits-of-xhtml'>  <b>  <strong>Beneficis de XHTML: </strong>  </b>  </h2>  <ul>  <li value='1'> <span>Totes les etiquetes XHTML han de tenir etiquetes de tancament i estan imbricades correctament. Això genera un codi més net. </span> </li>  <li value='2'> <span>Els documents XHTML són lleugers, la qual cosa significa que utilitzen menys amplada de banda. Això redueix el cost, sobretot si el vostre lloc web té mil pàgines. </span> </li>  <li value='3'> <span>Els documents XHTML estan ben formatats, ben formats i es poden transportar fàcilment a dispositius sense fil, lectors Braille i altres entorns web especialitzats. </span> </li>  <li value='4'> <span>Tots els nous desenvolupaments seran en XML (del qual XHTML és una aplicació). </span> </li>  <li value='5'> <span>XHTML treballa en associació amb CSS per crear pàgines web que es poden actualitzar fàcilment. </span> </li>  </ul>  <h2 id='difference-between-html-and-xhtml'>  <b>  <strong>Diferència entre HTML i 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 o HyperText Markup Language és el principal llenguatge de marcat per crear pàgines web </span> </td>  <td> <span>XHTML (Extensible HyperText Markup Language) és una família de llenguatges de marcat XML que reflecteixen o amplien versions del llenguatge de marcat d'hipertext (HTML) molt utilitzat. </span> </td>  </tr>  <tr>  <td> <span>Marc flexible que requereix un analitzador específic d'HTML </span> </td>  <td> <span>Subconjunt restrictiu d'XML que s'ha d'analitzar amb analitzadors XML estàndard </span> </td>  </tr>  <tr>  <td> <span>Proposat per Tim Berners-Lee el 1987 </span> </td>  <td> <span>Recomanació del World Wide Web Consortium l'any 2000. </span> </td>  </tr>  <tr>  <td> <span>Aplicació del llenguatge de marcat generalitzat estàndard (SGML). </span> </td>  <td> <span>Aplicació de XML </span> </td>  </tr>  <tr>  <td> <span>Ampliat des de SGML. </span> </td>  <td> <span>Ampliat des 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>
                                Comparteix                              </h4>
                             
                              <div class="flex flex-wrap justify-center gap-3">
                                 <!-- Twitter -->
                                 <a href="https://twitter.com/intent/tweet?text=Introducció a XHTML&url=https://www.techcodeview.com/ca/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/ca/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/ca/xhtml-introduction&title=Introducció a 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">
                        Potser T'Agradarà                     </h3>
                     <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                         <div class="group">
                              <a href="/ca/react-refs" 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/reactjs-tutorial/28/react-refs.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Reacciona Refs" 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="/ca/react-refs">Reacciona Refs </a>
                              </h4>
                         </div> <div class="group">
                              <a href="/ca/why-does-my-knee-feel-like-it-wants-pop-131948" 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/02/why-does-my-knee-feel-like-it-wants-pop.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Per què el meu genoll té la sensació que vol explotar?" 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="/ca/why-does-my-knee-feel-like-it-wants-pop-131948">Per què el meu genoll té la sensació que vol explotar? </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>
                Articles Més Populars             </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="/ca/what-is-ap-seminar-should-you-take-it-131914">
						 <img src="https://techcodeview.com/img/blog/57/what-is-ap-seminar-should-you-take-it.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Què és el seminari AP? L'has de prendre?" 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="/ca/what-is-ap-seminar-should-you-take-it-131914" class="hover:text-tech-500 transition-colors line-clamp-3">Què és el seminari AP? L'has de prendre? </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="/ca/what-does-alt-f4-do-what-do-if-alt-f4-doesn-t-work">
						 <img src="https://techcodeview.com/img/keyboard-shortcuts/76/what-does-alt-f4-do-what-do-if-alt-f4-doesn-t-work.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Què fa Alt+F4? Què fer si Alt+F4 no funciona?" 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="/ca/what-does-alt-f4-do-what-do-if-alt-f4-doesn-t-work" class="hover:text-tech-500 transition-colors line-clamp-3">Què fa Alt+F4? Què fer si Alt+F4 no funciona? </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="/ca/how-install-pip-macos">
						 <img src="https://techcodeview.com/img/python-pip/11/how-install-pip-macos.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Com instal·lar pip a macOS?" 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="/ca/how-install-pip-macos" class="hover:text-tech-500 transition-colors line-clamp-3">Com instal·lar pip a macOS? </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="/ca/switch-statement-c">
						 <img src="https://techcodeview.com/img/c-loops-control-statements/96/switch-statement-c.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Declaració de canvi 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="/ca/switch-statement-c" class="hover:text-tech-500 transition-colors line-clamp-3">Declaració de canvi 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="/ca/abstract-data-type-data-structure">
						 <img src="https://techcodeview.com/img/ds-tutorial/19/abstract-data-type-data-structure.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Tipus de dades abstractes a l'estructura de dades" 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="/ca/abstract-data-type-data-structure" class="hover:text-tech-500 transition-colors line-clamp-3">Tipus de dades abstractes a l'estructura de dades </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="/ca/what-is-myspace">
						 <img src="https://techcodeview.com/img/computer/14/what-is-myspace.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Què és Myspace?" 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="/ca/what-is-myspace" class="hover:text-tech-500 transition-colors line-clamp-3">Què és Myspace? </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="/ca/what-is-prospective-student-131128">
						 <img src="https://techcodeview.com/img/blog/41/what-is-prospective-student.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Què és un futur estudiant?" 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="/ca/what-is-prospective-student-131128" class="hover:text-tech-500 transition-colors line-clamp-3">Què és un futur estudiant? </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="/ca/python-2d-array">
						 <img src="https://techcodeview.com/img/python-tutorial/14/python-2d-array.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Matriu 2D de 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="/ca/python-2d-array" class="hover:text-tech-500 transition-colors line-clamp-3">Matriu 2D de 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="/ca/software-its-types">
						 <img src="https://techcodeview.com/img/picked/70/software-its-types.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Programari i els seus tipus" 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="/ca/software-its-types" class="hover:text-tech-500 transition-colors line-clamp-3">Programari i els seus tipus </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="/ca/find-sum-of-divisors-of-all-the-divisors-of-a-natural-number">
						 <img src="https://techcodeview.com/img/misc/39/find-sum-of-divisors-of-all-the-divisors-of-a-natural-number.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Troba la suma dels divisors de tots els divisors d'un nombre natural" 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="/ca/find-sum-of-divisors-of-all-the-divisors-of-a-natural-number" class="hover:text-tech-500 transition-colors line-clamp-3">Troba la suma dels divisors de tots els divisors d'un nombre natural </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">Categoria </h2>
		 </div>
		 <div class="flex flex-wrap gap-2">
             <a href="/ca/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">
                Bloc
             </a> <a href="/ca/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">
                Conversió De Java
             </a> <a href="/ca/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">
                Matemàtiques
             </a> <a href="/ca/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">
                Col·leccions Java
             </a> <a href="/ca/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">
                Diferències
             </a> <a href="/ca/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">
                Cadena De 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">Articles D'Interès </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/batch-script/96/batch-script-echo-command.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Script per lots: ordre d'eco" 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="/ca/batch-script/">Batch-Script </a> </div>
						 <h4 class="text-sm font-bold text-white leading-tight"> <a href="/ca/batch-script-echo-command">Script per lots: ordre d'eco </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/39/convert-list-string-java.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Converteix llista en cadena a 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="/ca/java-tutorial/">Tutorial De Java </a> </div>
						 <h4 class="text-sm font-bold text-white leading-tight"> <a href="/ca/convert-list-string-java">Converteix llista en cadena a 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/blog/99/act-standard-deviation.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Desviació estàndard ACT: què significa per a vostè" 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="/ca/blog/">Bloc </a> </div>
						 <h4 class="text-sm font-bold text-white leading-tight"> <a href="/ca/act-standard-deviation-1311390">Desviació estàndard ACT: què significa per a vostè </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/physics-class-12/37/logic-gates-definition.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Portes lògiques: definició, tipus, usos" 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="/ca/physics-class-12-cat/">Física-Classe-12 </a> </div>
						 <h4 class="text-sm font-bold text-white leading-tight"> <a href="/ca/logic-gates-definition">Portes lògiques: definició, tipus, usos </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/differences/02/difference-between-till.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Diferència entre Till i Until" 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="/ca/differences/">Diferències </a> </div>
						 <h4 class="text-sm font-bold text-white leading-tight"> <a href="/ca/difference-between-till">Diferència entre Till i Until </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/category/23/what-is-full-form-supw.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Quina és la forma completa de SUPW" 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="/ca/category/">Categoria </a> </div>
						 <h4 class="text-sm font-bold text-white leading-tight"> <a href="/ca/what-is-full-form-supw">Quina és la forma completa de SUPW </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 Tots Els Drets Reservats | 
                 <a href="//www.techcodeview.com/lt/">techcodeview.com </a> | 
                 <a href="/disclaimer" rel="nofollow noopener noreferrer" target="_blank">Exempció De Responsabilitat </a> | 
                 <a href="/about-us" rel="nofollow noopener noreferrer" target="_blank">Sobre Nosaltres </a> | 
                 <a href="/privacy-policy" rel="nofollow noopener noreferrer" target="_blank">Política De Privadesa </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>