Tailwind CSS nodrošina “ izlīdzināt vienumus ” utilītas, lai kontrolētu elastīgo un režģa elementu pozīciju gar konteinera šķērsasi. Tam ir dažādas lietderības klases, piemēram, “items-start”, “items-center”, “items-end”, “items-baseline” utt. Turklāt lietotāji var izmantot arī kursora rekvizītu ar “items-
Šajā rakstā tiks parādīta metode, kā lietot kursoru uz align-items” utilītprogrammām Tailwind CSS.
Kā lietot kursoru uz “vienumu izlīdzināšanas” utilītprogrammām programmā Tailwind?
Lai lietotu kursoru uz Tailwind utilītprogrammām “align-items”, izveidojiet HTML struktūru un pievienojiet “ novietojiet kursoru 'komunālo pakalpojumu klase ar vēlamo' vienumi-
Sintakse
< elements klasē = 'hover:items-
Aizstājiet
Piemērs
Šajā piemērā mēs izveidosim elastīgu konteineru ar rekvizītu “items-start”. Pēc tam mēs izmantosim ' kursors: vienumu centrs ” klasē “ Izvade Lai lietotu kursora novietošanas efektu Tailwind utilītprogrammām “līdzināt vienumus”, izmantojiet “ novietojiet kursoru 'lietderības klase ar konkrēto ' vienumi-
< ķermeni >
< div klasē = 'flex items-start hover:items-center justify-around text-center h-44 m-3 bg-pink-300 Gap-4' >
< div klasē = 'bg-pink-600 py-4 w-40' > 1 div >
< div klasē = 'bg-pink-600 py-12 w-40' > 2 div >
< div klasē = 'bg-pink-600 py-8 w-40' > 3 div >
div >
ķermeni >
Šeit:
No iepriekš minētās tīmekļa lapas var novērot, ka elastīgo elementu izlīdzinājums mainās pa konteinera šķērsasi, virzot kursoru. Secinājums