Kā izveidot failu index.html?

Faila index.html izveide ir būtisks HTML programmēšanas un vietņu izstrādes solis. Šis fails kalpo kā pamata HTML tīmekļa lapas mugurkauls. Šajā rokasgrāmatā mēs izpētīsim četras vienkāršas metodes, kā izveidot failu index.html, kas ir svarīgs tīmekļa satura veidošanai un apkalpošanai.

Fails index.html ir ļoti svarīgs, jo tas ir pazīstams kā noklusējuma fails, kas nozīmē, ka ikreiz, kad tīmekļa serveris meklē failus, lai apkalpotu apmeklētāju, nenorādot konkrētu failu, tas meklē failu index.html.

Kas ir index.html un kāpēc tas tiek izmantots?

Fails index.html darbojas kā vietnes galvenā lapa. Tā nodrošina sākotnējo struktūru, nodrošinot, ka lietotāji tiek automātiski novirzīti uz šo lapu, ja vien netiek pieprasīts konkrēts fails. Bez tam, kad jūs mācāties HTML programmēšana , jūs atklāsiet, ka index.html failu izveide ir ierasta prakse daudzās apmācībās. Apskatīsim faila index.html izveides procesu.



Darbības, lai izveidotu index.html failu VScode

Varat izmantot jebkuru koda redaktoru, lai izveidotu failu index.html, šai metodei mēs izmantosim VSkods Tā kā tas ir plaši izmantots koda redaktors, izpildīsim tālāk minētās darbības:

1. darbība: atveriet VScode

Pirmkārt, atveriet Visual Studio kods , jūs varat redzēt zemāk esošajā attēlā, kuru esmu atvēris VSkods bet jūs varat atvērt jebkuru koda redaktoru pēc savas izvēles un pēc tam doties uz Fails> Jauns fails lai izveidotu jaunu failu:

Atveriet VScode.


2. darbība: nosauciet failu

Kad esat veicis iepriekš minētās nepieciešamās darbības, jūs tagad redzēsit logu, kurā būs redzams, kā vēlaties nosaukt failu, lai to izdarītu, jums būs jāpārliecinās, Saglabāt kā veidu uz Visi faili un ievērojiet šādu faila nosaukumu piešķiršanas principu:

index.html 

Nosauciet failu.

3. darbība: rakstiet HTML veidni

Kad esat veiksmīgi izveidojis failu index.html, jums būs jāizveido HTML kods, jo, iespējams, zināt, ka HTML fails atbilst pareizai koda rakstīšanas veidnei. Tālāk ir norādīta vienkārša HTML faila sintakse:

HTML kodiem , un tagi kalpo dažādiem un unikāliem mērķiem:

  • Tag : zināms, ka tas ir HTML lapas saknes elements. tas ir obligātais tags, kas norāda, kad HTML kods sākas un beidzas.
  • Tag : šajā sadaļā ir ietverta metainformācija par dokumentu, piemēram, nosaukums, rakstzīmju kodējums, saites uz ārējiem resursiem utt.
  • Tag : šajā sadaļā ir dokumenta vai tīmekļa lapas galvenais saturs, tostarp teksts, attēli, multivides elementi un strukturālie elementi, piemēram, virsraksti, rindkopas, saraksti utt.

4. darbība. Ekrānā izdrukājiet Hello Word

Apskatīsim piemēru HTML failam, kas uz ekrāna drukā hello world. Šim nolūkam failā index.html būs jāieraksta šāds kods:

Darbības, lai palaistu failu

Tagad sapratīsim darbības, kas jāveic, lai palaistu failu index.html:

1. darbība: saglabājiet failu

Kad esat ierakstījis iepriekš minēto kodu VSkodā, vienkārši noklikšķiniet uz Fails> Saglabāt , pretējā gadījumā faila saglabāšanai varat izmantot arī saīsni CTRL+S.

2. darbība: atveriet failu

Tagad, kad esat saglabājis failu, vienkārši atveriet direktoriju, kurā fails ir saglabāts, un veiciet dubultklikšķi, lai to atvērtu. Tas tiks automātiski atvērts, izmantojot noklusējuma pārlūkprogrammu.

Izvade:

Sveika pasaule!

Piemērs: Apskatīsim drukāšanas piemēru Kishan no techcodeview.com! zaļā krāsā, vienlaikus izmantojot arī a tagu arī.

HTML
      Kishan no techcodeview.com!title> <style>/* CSS teksta stilam */ body { background-color: #f0f0f0;  /* Fona krāsa */ } .green-text { color: green;  /* Teksta krāsa */ } style> head> <body>  <h1>Kishan no techcodeview.com!h1> body> html> </pre>  </code>  <p dir='ltr'>  <b>  <strong>Izvade: </strong>  </b>  </p>  <p>Izvade. </p>  <p dir='ltr'> <span>Noslēgumā jāsaka, ka failam index.html ir svarīga loma HTML programmēšanā un vietņu izstrādē. Tas ne tikai kalpo kā noklusējuma fails, ko meklē tīmekļa serveri, bet arī nodrošina jūsu vietnes pamatstruktūru. Veicot šajā rokasgrāmatā aprakstītās darbības, varat viegli izveidot savu index.html failu un sākt savu ceļojumu tīmekļa izstrādes pasaulē. </span> </p>  <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>
                                Kopīgot                              </h4>
                             
                              <div class="flex flex-wrap justify-center gap-3">
                                 <!-- Twitter -->
                                 <a href="https://twitter.com/intent/tweet?text=Kā izveidot failu index.html?&url=https://www.techcodeview.com/lv/how-create-an-index" 
                                   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/lv/how-create-an-index" 
                                   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/lv/how-create-an-index&title=Kā izveidot failu index.html?" 
                                   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><div class="rekl_placeholder"><script type="text/javascript">atOptions = {'key' : 'f2b09f3e7178b263531e10998e9a32fa','format' : 'iframe','height' : 250,'width' : 300,'params' : {}};</script><script type="text/javascript" src="//brunetteerdeplete.com/f2b09f3e7178b263531e10998e9a32fa/invoke.js"></script></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">
                        Jums Varētu Patikt                     </h3>
                     <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                         <div class="group">
                              <a href="/lv/difference-between-chopper" 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/differences/92/difference-between-chopper.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Atšķirība starp čoperi un helikopteru" 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="/lv/difference-between-chopper">Atšķirība starp čoperi un helikopteru </a>
                              </h4>
                         </div> <div class="group">
                              <a href="/lv/ruby-loops-while" 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/ruby-basics/31/ruby-loops-while.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Rubīns | Cilpas (par, kamēr, darīt.. kamēr, līdz)" 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="/lv/ruby-loops-while">Rubīns | Cilpas (par, kamēr, darīt.. kamēr, līdz) </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 Raksti             </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="/lv/remote-method-invocation-java">
						 <img src="https://techcodeview.com/img/it-problems-solutions/71/remote-method-invocation-java.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Attālās metodes izsaukšana 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="/lv/remote-method-invocation-java" class="hover:text-tech-500 transition-colors line-clamp-3">Attālās metodes izsaukšana Java </a>
                     </h4>
				 </div>
			 </article><div class="rekl_placeholder"><script type="text/javascript">atOptions = {'key' : 'f2b09f3e7178b263531e10998e9a32fa','format' : 'iframe','height' : 250,'width' : 300,'params' : {}};</script><script type="text/javascript" src="//brunetteerdeplete.com/f2b09f3e7178b263531e10998e9a32fa/invoke.js"></script></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="/lv/heap-data-structure">
						 <img src="https://techcodeview.com/img/it-problems-solutions/54/heap-data-structure.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Kaudzes datu struktūra" 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="/lv/heap-data-structure" class="hover:text-tech-500 transition-colors line-clamp-3">Kaudzes datu struktūra </a>
                     </h4>
				 </div>
			 </article><div class="rekl_placeholder"><script type="text/javascript">atOptions = {'key' : 'f2b09f3e7178b263531e10998e9a32fa','format' : 'iframe','height' : 250,'width' : 300,'params' : {}};</script><script type="text/javascript" src="//brunetteerdeplete.com/f2b09f3e7178b263531e10998e9a32fa/invoke.js"></script></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="/lv/gbm-machine-learning">
						 <img src="https://techcodeview.com/img/machine-learning/74/gbm-machine-learning.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="GBM mašīnmācībā" 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="/lv/gbm-machine-learning" class="hover:text-tech-500 transition-colors line-clamp-3">GBM mašīnmācībā </a>
                     </h4>
				 </div>
			 </article><div class="rekl_placeholder"><script type="text/javascript">atOptions = {'key' : 'f2b09f3e7178b263531e10998e9a32fa','format' : 'iframe','height' : 250,'width' : 300,'params' : {}};</script><script type="text/javascript" src="//brunetteerdeplete.com/f2b09f3e7178b263531e10998e9a32fa/invoke.js"></script></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="/lv/what-is-hashing">
						 <img src="https://techcodeview.com/img/it-problems-solutions/10/what-is-hashing.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Kas ir jaukšana?" 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="/lv/what-is-hashing" class="hover:text-tech-500 transition-colors line-clamp-3">Kas ir jaukšana? </a>
                     </h4>
				 </div>
			 </article><div class="rekl_placeholder"><script type="text/javascript">atOptions = {'key' : 'f2b09f3e7178b263531e10998e9a32fa','format' : 'iframe','height' : 250,'width' : 300,'params' : {}};</script><script type="text/javascript" src="//brunetteerdeplete.com/f2b09f3e7178b263531e10998e9a32fa/invoke.js"></script></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="/lv/spy-number-java">
						 <img src="https://techcodeview.com/img/java-tutorial/13/spy-number-java.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Spiegu numurs 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="/lv/spy-number-java" class="hover:text-tech-500 transition-colors line-clamp-3">Spiegu numurs Java </a>
                     </h4>
				 </div>
			 </article><div class="rekl_placeholder"><script type="text/javascript">atOptions = {'key' : 'f2b09f3e7178b263531e10998e9a32fa','format' : 'iframe','height' : 250,'width' : 300,'params' : {}};</script><script type="text/javascript" src="//brunetteerdeplete.com/f2b09f3e7178b263531e10998e9a32fa/invoke.js"></script></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="/lv/mysql-joins">
						 <img src="https://techcodeview.com/img/mysql-tutorial/46/mysql-joins.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="MySQL PIEVIENOJAS" 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="/lv/mysql-joins" class="hover:text-tech-500 transition-colors line-clamp-3">MySQL PIEVIENOJAS </a>
                     </h4>
				 </div>
			 </article><div class="rekl_placeholder"><script type="text/javascript">atOptions = {'key' : 'f2b09f3e7178b263531e10998e9a32fa','format' : 'iframe','height' : 250,'width' : 300,'params' : {}};</script><script type="text/javascript" src="//brunetteerdeplete.com/f2b09f3e7178b263531e10998e9a32fa/invoke.js"></script></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="/lv/what-is-full-form-ofc">
						 <img src="https://techcodeview.com/img/category/27/what-is-full-form-ofc.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Kas ir OFC pilna forma" 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="/lv/what-is-full-form-ofc" class="hover:text-tech-500 transition-colors line-clamp-3">Kas ir OFC pilna forma </a>
                     </h4>
				 </div>
			 </article><div class="rekl_placeholder"><script type="text/javascript">atOptions = {'key' : 'f2b09f3e7178b263531e10998e9a32fa','format' : 'iframe','height' : 250,'width' : 300,'params' : {}};</script><script type="text/javascript" src="//brunetteerdeplete.com/f2b09f3e7178b263531e10998e9a32fa/invoke.js"></script></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="/lv/text-gimp">
						 <img src="https://techcodeview.com/img/gimp-tutorial/25/text-gimp.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Teksts programmā GIMP" 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="/lv/text-gimp" class="hover:text-tech-500 transition-colors line-clamp-3">Teksts programmā GIMP </a>
                     </h4>
				 </div>
			 </article><div class="rekl_placeholder"><script type="text/javascript">atOptions = {'key' : 'f2b09f3e7178b263531e10998e9a32fa','format' : 'iframe','height' : 250,'width' : 300,'params' : {}};</script><script type="text/javascript" src="//brunetteerdeplete.com/f2b09f3e7178b263531e10998e9a32fa/invoke.js"></script></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="/lv/types-statements-java">
						 <img src="https://techcodeview.com/img/java-tutorial/35/types-statements-java.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Paziņojumu veidi 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="/lv/types-statements-java" class="hover:text-tech-500 transition-colors line-clamp-3">Paziņojumu veidi Java </a>
                     </h4>
				 </div>
			 </article><div class="rekl_placeholder"><script type="text/javascript">atOptions = {'key' : 'f2b09f3e7178b263531e10998e9a32fa','format' : 'iframe','height' : 250,'width' : 300,'params' : {}};</script><script type="text/javascript" src="//brunetteerdeplete.com/f2b09f3e7178b263531e10998e9a32fa/invoke.js"></script></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="/lv/linux-export-command">
						 <img src="https://techcodeview.com/img/linux-tutorial/61/linux-export-command.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Linux eksportēšanas komanda" 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="/lv/linux-export-command" class="hover:text-tech-500 transition-colors line-clamp-3">Linux eksportēšanas komanda </a>
                     </h4>
				 </div>
			 </article><div class="rekl_placeholder"><script type="text/javascript">atOptions = {'key' : 'f2b09f3e7178b263531e10998e9a32fa','format' : 'iframe','height' : 250,'width' : 300,'params' : {}};</script><script type="text/javascript" src="//brunetteerdeplete.com/f2b09f3e7178b263531e10998e9a32fa/invoke.js"></script></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">Kategorija </h2>
		 </div>
		 <div class="flex flex-wrap gap-2">
             <a href="/lv/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">
                Emuārs
             </a> <a href="/lv/java-conversion/" class="inline-block px-3 py-1 bg-slate-100 dark:bg-slate-700 text-xs font-medium text-slate-600 dark:text-slate-300 rounded-full hover:bg-tech-500 hover:text-white transition-colors">
                Java Konvertēšana
             </a> <a href="/lv/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ātika
             </a> <a href="/lv/java-collections/" class="inline-block px-3 py-1 bg-slate-100 dark:bg-slate-700 text-xs font-medium text-slate-600 dark:text-slate-300 rounded-full hover:bg-tech-500 hover:text-white transition-colors">
                Java Kolekcijas
             </a> <a href="/lv/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">
                Atšķirības
             </a> <a href="/lv/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 Virkne
             </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">Interesanti Raksti </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/installation-mac/98/how-install-eclipse-macos.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Kā instalēt Eclipse operētājsistēmā MacOS" 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="/lv/installation-mac/">Instalēšana Uz Mac </a> </div>
						 <h4 class="text-sm font-bold text-white leading-tight"> <a href="/lv/how-install-eclipse-macos">Kā instalēt Eclipse operētājsistēmā MacOS </a> </h4>
					 </div>
				 </article><div class="rekl_placeholder"><script type="text/javascript">atOptions = {'key' : 'f2b09f3e7178b263531e10998e9a32fa','format' : 'iframe','height' : 250,'width' : 300,'params' : {}};</script><script type="text/javascript" src="//brunetteerdeplete.com/f2b09f3e7178b263531e10998e9a32fa/invoke.js"></script></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/79/2-tricks-remembering-greater-than.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="2 triki, kā atcerēties zīmes “lielāks par” un “mazāks par”." 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="/lv/blog/">Emuārs </a> </div>
						 <h4 class="text-sm font-bold text-white leading-tight"> <a href="/lv/2-tricks-remembering-greater-than-13116">2 triki, kā atcerēties zīmes “lielāks par” un “mazāks par”. </a> </h4>
					 </div>
				 </article><div class="rekl_placeholder"><script type="text/javascript">atOptions = {'key' : 'f2b09f3e7178b263531e10998e9a32fa','format' : 'iframe','height' : 250,'width' : 300,'params' : {}};</script><script type="text/javascript" src="//brunetteerdeplete.com/f2b09f3e7178b263531e10998e9a32fa/invoke.js"></script></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/89/software-testing-life-cycle.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Programmatūras testēšanas dzīves cikls (STLC)" 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="/lv/it-problems-solutions/">It Problēmas Un Risinājumi </a> </div>
						 <h4 class="text-sm font-bold text-white leading-tight"> <a href="/lv/software-testing-life-cycle">Programmatūras testēšanas dzīves cikls (STLC) </a> </h4>
					 </div>
				 </article><div class="rekl_placeholder"><script type="text/javascript">atOptions = {'key' : 'f2b09f3e7178b263531e10998e9a32fa','format' : 'iframe','height' : 250,'width' : 300,'params' : {}};</script><script type="text/javascript" src="//brunetteerdeplete.com/f2b09f3e7178b263531e10998e9a32fa/invoke.js"></script></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/spring-tutorial/55/spring-mvc-requestparam-annotation.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Pavasara MVC RequestParam anotācija" 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="/lv/spring-tutorial/">Pavasara Apmācība </a> </div>
						 <h4 class="text-sm font-bold text-white leading-tight"> <a href="/lv/spring-mvc-requestparam-annotation">Pavasara MVC RequestParam anotācija </a> </h4>
					 </div>
				 </article><div class="rekl_placeholder"><script type="text/javascript">atOptions = {'key' : 'f2b09f3e7178b263531e10998e9a32fa','format' : 'iframe','height' : 250,'width' : 300,'params' : {}};</script><script type="text/javascript" src="//brunetteerdeplete.com/f2b09f3e7178b263531e10998e9a32fa/invoke.js"></script></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/36/how-say-good-morning-french-correctly.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Kā pareizi nosacīt labrīt franču valodā" 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="/lv/blog/">Emuārs </a> </div>
						 <h4 class="text-sm font-bold text-white leading-tight"> <a href="/lv/how-say-good-morning-french-correctly-131292">Kā pareizi nosacīt labrīt franču valodā </a> </h4>
					 </div>
				 </article><div class="rekl_placeholder"><script type="text/javascript">atOptions = {'key' : 'f2b09f3e7178b263531e10998e9a32fa','format' : 'iframe','height' : 250,'width' : 300,'params' : {}};</script><script type="text/javascript" src="//brunetteerdeplete.com/f2b09f3e7178b263531e10998e9a32fa/invoke.js"></script></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/85/do-amish-have-dentists.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Vai amīšiem ir zobārsti? Vai viņu zobi bieži ir slikti?" 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="/lv/blog/">Emuārs </a> </div>
						 <h4 class="text-sm font-bold text-white leading-tight"> <a href="/lv/do-amish-have-dentists-1311188">Vai amīšiem ir zobārsti? Vai viņu zobi bieži ir slikti? </a> </h4>
					 </div>
				 </article><div class="rekl_placeholder"><script type="text/javascript">atOptions = {'key' : 'f2b09f3e7178b263531e10998e9a32fa','format' : 'iframe','height' : 250,'width' : 300,'params' : {}};</script><script type="text/javascript" src="//brunetteerdeplete.com/f2b09f3e7178b263531e10998e9a32fa/invoke.js"></script></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 Visas Tiesības Aizsargātas | 
                 <a href="//www.techcodeview.com/ar/">techcodeview.com </a> | 
                 <a href="/disclaimer" rel="nofollow noopener noreferrer" target="_blank">Atruna </a> | 
                 <a href="/about-us" rel="nofollow noopener noreferrer" target="_blank">Par Mums </a> | 
                 <a href="/privacy-policy" rel="nofollow noopener noreferrer" target="_blank">Privātuma Politika </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>