Komanda të shpeshta

2 min

Disa nga komandat më të shpeshta të cilat përdoren dhe nga më të rëndsishmet

1.Grid:

            
                <div class="grid grid-cols-3 gap-4">
  <div class="bg-gray-300">Item 1</div>
  <div class="bg-gray-400">Item 2</div>
  <div class="bg-gray-500">Item 3</div>
</div>
            
        

Në këtë shembull, klasa e grid vendos një container me tre kolona (grid-cols-3) dhe një hapsire prej 4 njësive midis secilit artikull (gap-4). Tre artikujt vendosen më pas në secilën kolonë të gridit.

2.Flex:

Për të shpjeguar klasat justify-between dhe items-center në TailwindCSS, mund të përdorni fragmentin e mëposhtëm të kodit:

            
                <div class="flex justify-between items-center">
  <div class="bg-gray-300 py-4">Left Item</div>
  <div class="bg-gray-300 py-10">Center Item</div>
  <div class="bg-gray-400 py-8">Right Item</div>
</div>
            
        

Në këtë shembull, klasa flex krijon një container flex me dy artikuj flex. Klasa justify-between i rreshton dy div-s në fillim dhe në fund të container, duke i larguar ato dhe duke krijuar hapësirë boshe në mes. Klasa items-center i përqendron dy artikujt vertikalisht brenda kontejnerit.

3.Hidden:

            
                <div class="md:block hidden">
  This will only show on screens larger than medium.
</div>
            
        

Në këtë shembull, klasa md:block tregon elementin në ekranet me përmasa mesatare ose më të mëdha, ndërsa klasa hidden e fsheh atë në ekrane më të vogla.

4.Container and text styles:

Për të vendosur ngjyrën e tekstit dhe peshën e shkronjave dhe për t'i mbështjellë në një enë, mund të përdorni kodin e mëposhtëm në TailwindCSS:

            
                <div class="container mx-auto">
  <p class="text-gray-800 font-bold">This is some bold black text.</p>
</div>
            
        

Në këtë shembull, klasa e container përqendron tekstin brenda faqes duke vendosur kufijtë e gjerësisë maksimale dhe horizontale. Klasa mx-auto e përqendron kontejnerin horizontalisht. Klasa text-gry-800 vendos ngjyrën e tekstit në një gri të errët. Klasa font-bold e bën tekstin të trashë.

.
.
.
.
.

#ReLOaD

Kjo platformë është zhvilluar si pjesë e projektit Robokid të organizatës YEP, i cili zbatohet në kuadër të "Programi rajonal për demokraci lokale në Ballkanin Perëndimor 2 - ReLOaD2 i cili është i financuar nga Bashkimi Evropian (BE), ndërsa e implementon Programi për Zhvillim i Kombeve të Bashkuara (UNDP). Për përmbajtjen e kësaj platforme, si dhe qëndrimet e paraqitura në të, janë përgjegjës vetëm organizata YEP dhe ato në asnjë mënyrë nuk pasqyrojnë pikëpamjet e Bashkimit Evropian (BE) ose të Programit për Zhvillim të Kombeve të Bashkuara (UNDP) .

Copyright © 2023 Techup | Powered by YEP