Tailwind CSS: differenze tra le versioni

Contenuto cancellato Contenuto aggiunto
Nessun oggetto della modifica
 
(18 versioni intermedie di 5 utenti non mostrate)
Riga 1:
 
{{Software
|Nome = Tailwind CSS
|Logo = Tailwind CSS logo.svg
|Sviluppatore = Adam Wathan, Jonathan Reinink, David Hemphill, e Steve Schoger
[[Categoria:Software|SistemaOperativo = multipiattaforma]]
|UltimaVersione = 3.4.17 (17 dicembre 2024)
|SistemaOperativo = Multipiattaforma (su [[browser]])
|Linguaggio = CSS
|Linguaggio2 = Typescript
|Linguaggio3 =
|Genere = web framework
|SoftwareLibero = si
|SitoWeb = https://tailwindcss.com/
|nome =
|autore =
Line 20 ⟶ 16:
}}
 
'''Tailwind CSS''' è un [[Framework per applicazioni web|framework]] [[CSS]] [[open source]] che si distingue da altri framework come [[Bootstrap (framework)|Bootstrap]].: Invece dianziché offrire una serie di classi predefinite per elementi specifici come pulsanti o tabelle, Tailwind mette a disposizione un ampio elenco di classi CSS "di utilità". Queste classi possono essere combinate e personalizzate per definire lo stile di ogni elemento in modo flessibile e modulare.
 
Al 5 agosto 2024, Tailwind CSS ha oltre 81.000 stelle su [[GitHub]].<ref>{{Cita testo|url=https://github.com/tailwindlabs/tailwindcss}}</ref>
 
== Caratteristiche ==
A causa delle differenze nei concetti di base rispetto ad altri framework CSS tradizionali come Bootstrap, è importante conoscere la filosofia da cui è stato creato Tailwind, nonché il suo utilizzo di base.
Line 67 ⟶ 64:
Le varianti in Tailwind CSS si compongono di due elementi: la condizione da soddisfare e la classe da applicare quando tale condizione è rispettata. Ad esempio, la variante <code>md:bg-yellow-400</code> applicherà la classe <code>bg-yellow-400</code> solo se la dimensione dello schermo raggiunge o supera il valore definito per <code>md</code> (medio). Questo approccio consente di adattare lo stile degli elementi in base a criteri specifici, come le dimensioni dello schermo o altri stati.
 
Tailwind CSS è sviluppato utilizzando [[JavaScript]], viene eseguito tramite [[Node.js]] e si installa con i gestori di pacchetti come [[Npm (software)|npm]] o [[yarn]] .<ref>{{Cita web|lingua=en|url=https://tailwindcss.com/docs/installation|sito=tailwindcss.com}}</ref>
 
=== Impostazioni e temi ===
Line 78 ⟶ 75:
 
==== Modalità just-in-time ====
La modalità ''JIT'' (''[[Compilatore just-in-time|Just-In-Time]]'') è un approccio avanzato introdotto in Tailwind CSS per generare il CSS in modo più efficiente. A differenza del metodo tradizionale, che genera tutte le possibili classi per poi rimuovere quelle inutilizzate, la modalità JIT analizza in tempo reale il contenuto dei file HTML (o di altre estensioni e percorsi configurati) e genera immediatamente solo le classi effettivamente necessarie. Questo sistema riduce drasticamente la dimensione del file CSS e migliora la velocità di sviluppo, permettendo un feedback più rapido durante il lavoro.
 
Generando esclusivamente il CSS necessario, la modalità JIT riduce significativamente la dimensione del file CSS. Questo miglioramento tecnico ha permesso di introdurre numerose nuove varianti e classi di utilità, ampliando le possibilità di personalizzazione. Inoltre, la modalità JIT consente di creare classi di utilità al volo con valori arbitrari non predefiniti nella configurazione, offrendo maggiore flessibilità e un controllo più dettagliato sugli stili direttamente nel codice.
Line 89 ⟶ 86:
 
== Voci correlate ==
 
* [[CSS]]
* [[JQuery]]
* [[Framework per applicazioni web]]
* [[Bootstrap (framework)|Bootstrap (framework front-end)]]
 
== Collegamenti esterni ==
* {{Collegamenti esterni}}
 
{{Portale|informatica|Internet}}
 
* [https://tailwindcss.com/docs Documentazione ufficiale di Tailwind]
* [https://github.com/tailwindlabs/tailwindcss Repository Github]
* [https://lembdadev.com/css-to-tailwind-converter Tailwind Converter]
[[Categoria:Software con licenza MIT]]
[[Categoria:CSS]]
[[Categoria:Framework per applicazioni web]]
[[Categoria:Software multipiattaforma]]
[[Categoria:Software libero]]
[[Categoria:Web design]]
[[Categoria:Framework per applicazioni web liberi]]