Come inserire spazi/tabulazioni nel testo utilizzando HTML e CSS
In questo articolo impareremo come aggiungere spazi/tabulazioni nel testo utilizzando HTML E CSS . Come sappiamo, l'HTML non supporta più di uno spazio per impostazione predefinita, ecco perché abbiamo bisogno di alcuni attributi o CSS aggiuntivi per ottenere spazio extra tra il testo.
Questi sono i seguenti approcci: utilizzandoli possiamo aggiungere spazi/tabulazioni nel testo:
Tabella dei contenuti
Utilizzo delle entità HTML
- IL l'entità carattere viene utilizzata per denotare uno spazio unificatore che è uno spazio fisso. Questo può essere percepito come il doppio dello spazio di uno spazio normale. Viene utilizzato per creare uno spazio in una riga che non può essere interrotto dal ritorno a capo automatico.
- IL l'entità carattere viene utilizzata per denotare uno spazio 'en' che significa la dimensione di mezzo punto del carattere corrente. Questo può essere percepito come il doppio dello spazio di uno spazio normale.
- IL l'entità carattere viene utilizzata per denotare uno spazio 'em' che significa uguale alla dimensione in punti del carattere corrente. Questo può essere percepito come quattro volte lo spazio di uno spazio normale.
Sintassi
// Regular space // Two spaces gap // Four spaces gap
Esempio: In questo esempio, vedremo come utilizzare gli spazi e per favore non dimenticare di aggiungere, e &emsp nel codice in cui è necessario aggiungere spazio tra il testo.
html Come inserire spazi/tabulazioni nel testo utilizzando HTML/CSS? titolo> testa> <body> <h1 style='color: green'>techcodeview.comh1> <b>Come inserire spazi/tabulazioni nel testo utilizzando HTML/CSS?b> <p>Questo è uno spazio normale.p> <p>Questo è uno spazio di due spazi.p> <p>Questo è un gap di quattro spazi.p> body> html> </pre> </code> <p dir='ltr'> <b> <strong>Produzione: </strong> </b> </p> <img src='//techcodeview.com/img/css-questions/66/how-insert-spaces-tabs-text-using-html.webp' alt='entità-char'> <h2 id='using-the-tabsize-property-in-css'> <b> <strong>Utilizzo della proprietà delle dimensioni della scheda nei CSS </strong> </b> </h2> <p dir='ltr'> <span>IL </span> <span>proprietà della dimensione della scheda nei CSS </span> <span>viene utilizzato per impostare il numero di spazi visualizzati su ciascun carattere di tabulazione. La modifica di questo valore consente di inserire la quantità di spazio necessaria su un carattere di tabulazione. Questo metodo tuttavia funziona solo con testo preformattato (utilizzando </span> </p> <pre> tags). The tab character can be inserted by holding the Alt and pressing 0 and 9 together. Syntax .tab { tab-size: value; /* for e.g: value = 2*/ } Example: In this example, we are going to implement the above-explained method. html <html> <head> <title>Come inserire spazi/tabulazioni nel testo utilizzando HTML/CSS? titolo> <style>.tab1 { dimensione scheda: 2; } .tab2 { dimensione scheda: 4; } .tab4 { dimensione tab: 8; } stile> testa> <body> <h1 style='color: green'>techcodeview.comh1> <b>Come inserire spazi/tabulazioni nel testo utilizzando HTML/CSS?b> <prezalupa>Questa è una scheda con 2 spazi.pre> <prezalupa>Questa è una scheda con 4 spazi.pre> <prezalupa>Questa è una scheda con 8 spazi.pre> body> html> Output: utilizzo di CSS personalizzati È possibile creare una nuova classe che fornisce una certa quantità di spaziatura utilizzando la proprietà margin-left. La quantità di spazio potrebbe essere data dal numero di pixel specificati in questa proprietà. Anche la proprietà display è impostata su 'inline-block' in modo che non venga aggiunta alcuna interruzione di riga dopo l'elemento. Ciò consente allo spazio di sedersi accanto al testo e ad altri elementi. Sintassi .tab { display: inline-block; margine sinistro: valore; /* per es: valore = 40px*/ } Esempio: In questo esempio, implementeremo il metodo sopra spiegato. html <html> <head> <title>Come inserire spazi/tabulazioni nel testo utilizzando HTML/CSS? titolo> <style>.tab { display: blocco in linea; margine sinistro: 40px; } stile> testa> <body> <h1 style='color: green'>techcodeview.comh1> <b>Come inserire spazi/tabulazioni nel testo utilizzando HTML/CSS?b> <p>Questo è un <span>span>tab spazio nel documento.p> body> html> Output: </pre>
</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>
Condividere </h4>
<div class="flex flex-wrap justify-center gap-3">
<!-- Twitter -->
<a href="https://twitter.com/intent/tweet?text=Come inserire spazi/tabulazioni nel testo utilizzando HTML e CSS&url=https://www.techcodeview.com/it/how-insert-spaces-tabs-text-using-html"
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/it/how-insert-spaces-tabs-text-using-html"
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/it/how-insert-spaces-tabs-text-using-html&title=Come inserire spazi/tabulazioni nel testo utilizzando HTML e CSS"
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">
Potrebbe Piacerti </h3>
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
<div class="group">
<a href="/it/normal-distribution-definition" 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/math-statistics/51/normal-distribution-definition.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Distribuzione normale: definizione, usi ed esempi" 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="/it/normal-distribution-definition">Distribuzione normale: definizione, usi ed esempi </a>
</h4>
</div> <div class="group">
<a href="/it/autocad-background-color" 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/autocad-tutorial/63/autocad-background-color.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Colore di sfondo di AutoCAD" 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="/it/autocad-background-color">Colore di sfondo di AutoCAD </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>
Articoli Più </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="/it/spring-boot-jpa">
<img src="https://techcodeview.com/img/spring-boot-tutorial/03/spring-boot-jpa.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Avviamento primaverile dell'APP" 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="/it/spring-boot-jpa" class="hover:text-tech-500 transition-colors line-clamp-3">Avviamento primaverile dell'APP </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="/it/when-is-psat-2023-psat-test-dates-1311626">
<img src="https://techcodeview.com/img/blog/45/when-is-psat-2023-psat-test-dates.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Quando è il PSAT? Date dei test PSAT 2023" 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="/it/when-is-psat-2023-psat-test-dates-1311626" class="hover:text-tech-500 transition-colors line-clamp-3">Quando è il PSAT? Date dei test PSAT 2023 </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="/it/clone-a-linked-list-with-next-and-random-pointer-in-o-1-space">
<img src="https://techcodeview.com/img/linked-list/56/clone-a-linked-list-with-next-and-random-pointer-in-o-1-space.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Clona una lista concatenata con puntatore successivo e casuale nello spazio O(1)." 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="/it/clone-a-linked-list-with-next-and-random-pointer-in-o-1-space" class="hover:text-tech-500 transition-colors line-clamp-3">Clona una lista concatenata con puntatore successivo e casuale nello spazio O(1). </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="/it/bar-plot-matplotlib">
<img src="https://techcodeview.com/img/python-matplotlib/75/bar-plot-matplotlib.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Grafico a barre in Matplotlib" 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="/it/bar-plot-matplotlib" class="hover:text-tech-500 transition-colors line-clamp-3">Grafico a barre in Matplotlib </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="/it/what-are-computer-post">
<img src="https://techcodeview.com/img/computer/09/what-are-computer-post.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Cosa sono i codici POST e bip del computer?" 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="/it/what-are-computer-post" class="hover:text-tech-500 transition-colors line-clamp-3">Cosa sono i codici POST e bip del computer? </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="/it/are-you-accused-cheating-sat-act-131442">
<img src="https://techcodeview.com/img/blog/61/are-you-accused-cheating-sat-act.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Sei accusato di aver tradito al SAT/ACT? Cosa fare" 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="/it/are-you-accused-cheating-sat-act-131442" class="hover:text-tech-500 transition-colors line-clamp-3">Sei accusato di aver tradito al SAT/ACT? Cosa fare </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="/it/celebrity-act-scores-steve-jobs-1311396">
<img src="https://techcodeview.com/img/blog/73/celebrity-act-scores-steve-jobs.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Punteggi ACT di celebrità (Steve Jobs, Barack Obama, Marilyn Monroe)" 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="/it/celebrity-act-scores-steve-jobs-1311396" class="hover:text-tech-500 transition-colors line-clamp-3">Punteggi ACT di celebrità (Steve Jobs, Barack Obama, Marilyn Monroe) </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="/it/node-js-fs-writefile-method">
<img src="https://techcodeview.com/img/node-js-fs-module/95/node-js-fs-writefile-method.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Metodo Node JS fs.writeFile()" 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="/it/node-js-fs-writefile-method" class="hover:text-tech-500 transition-colors line-clamp-3">Metodo Node JS fs.writeFile() </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="/it/best-summary-analysis-131856">
<img src="https://techcodeview.com/img/blog/14/best-summary-analysis.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Miglior riassunto e analisi: Il grande Gatsby, capitolo 7" 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="/it/best-summary-analysis-131856" class="hover:text-tech-500 transition-colors line-clamp-3">Miglior riassunto e analisi: Il grande Gatsby, capitolo 7 </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="/it/thread-concept-java">
<img src="https://techcodeview.com/img/java-tutorial/47/thread-concept-java.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Concetto di discussione in 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="/it/thread-concept-java" class="hover:text-tech-500 transition-colors line-clamp-3">Concetto di discussione in Java </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="/it/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="/it/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">
Conversione Java
</a> <a href="/it/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">
Matematica
</a> <a href="/it/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">
Collezioni Java
</a> <a href="/it/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">
Differenze
</a> <a href="/it/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">
Stringa 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">Articoli Interessanti </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/machine-learning/74/gbm-machine-learning.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="GBM nell'apprendimento automatico" 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/machine-learning/">Apprendimento Automatico </a> </div>
<h4 class="text-sm font-bold text-white leading-tight"> <a href="/it/gbm-machine-learning">GBM nell'apprendimento automatico </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/89/software-testing-life-cycle.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Ciclo di vita del test del software (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="/it/it-problems-solutions/">Problemi E Soluzioni Informatiche </a> </div>
<h4 class="text-sm font-bold text-white leading-tight"> <a href="/it/software-testing-life-cycle">Ciclo di vita del test del software (STLC) </a> </h4>
</div>
</article>
<!-- /ARTICLE --> <!-- ARTICLE -->
<article class="relative aspect-video rounded-lg overflow-hidden group mb-2">
<div class="absolute inset-0">
<img src="https://techcodeview.com/img/computer/10/uses-computer.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Usi del computer" 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/computer/">Computer </a> </div>
<h4 class="text-sm font-bold text-white leading-tight"> <a href="/it/uses-computer">Usi del computer </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/dbms-tutorial/19/types-relationship-dbms.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Tipi di relazione nei DBMS" 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/dbms-tutorial/">Esercitazione Sul Dbms </a> </div>
<h4 class="text-sm font-bold text-white leading-tight"> <a href="/it/types-relationship-dbms">Tipi di relazione nei DBMS </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/geeks-premier-league-2023/03/how-add-user-group-linux.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Come aggiungere un utente a un gruppo in Linux" 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/geeks-premier-league-2023-cat/">Geek Premier League 2023 </a> </div>
<h4 class="text-sm font-bold text-white leading-tight"> <a href="/it/how-add-user-group-linux">Come aggiungere un utente a un gruppo in Linux </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/asp-net-tutorial/91/asp-net-mvc-routing.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Routing ASP.NET MVC" 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/asp-net-tutorial/">Esercitazione Su Asp.net </a> </div>
<h4 class="text-sm font-bold text-white leading-tight"> <a href="/it/asp-net-mvc-routing">Routing ASP.NET MVC </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 Tutti I Diritti Riservati |
<a href="//www.techcodeview.com/lv/">techcodeview.com </a> |
<a href="/disclaimer" rel="nofollow noopener noreferrer" target="_blank">Disclaimer </a> |
<a href="/about-us" rel="nofollow noopener noreferrer" target="_blank">Chi Siamo </a> |
<a href="/privacy-policy" rel="nofollow noopener noreferrer" target="_blank">Politica Sulla Riservatezza </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>