Kā lietot pārtraukuma punktus un multivides vaicājumus, ja programmā Tailwind tiek izmantots “clear”?

Ka Lietot Partraukuma Punktus Un Multivides Vaicajumus Ja Programma Tailwind Tiek Izmantots Clear



Tailwind CSS piedāvājumi “ skaidrs ” utilītprogrammas, lai apstrādātu satura ietīšanu ap noteiktu elementu. Šīs utilītas var izmantot, lai norādītos elementus pārvietotu zem jebkura konteinera elementa, kas peld ar kreiso vai labo pusi. Turklāt lietotāji var arī izmantot pārtraukuma punktus un multivides vaicājumus 'clear' utilītprogrammā, lai kontrolētu konkrētā elementa uzvedību, kad tas atrodas blakus peldošam elementam dažādos ekrāna izmēros.

Šajā rakstā tiks parādīta metode, kā lietot pārtraukuma punktus un multivides vaicājumus Tailwind “notīrītajām” utilītprogrammām.

Kā izmantot pārtraukuma punktus un multivides vaicājumus, ja ir “clear” programmā Tailwind?

Lai lietotu noteiktus pārtraukuma punktus un multivides vaicājumus “tīrajām” utilītas programmā Tailwind, izveidojiet HTML struktūru. Pēc tam definējiet vēlamo vērtību “ notīrīt- ” utilīta dažādiem ekrāna izmēriem, izmantojot md ” vai “ lg ” pārtraukuma punkti. Visbeidzot, verifikācijai mainiet tīmekļa lapas ekrāna izmēru.





Piemērs
Šajā piemērā mēs izmantosim ' md ' pārtraukuma punkts ar ' skaidrs-gan ' lietderība un ' lg ' pārtraukuma punkts ar ' skaidrs-nav ' lietderība sadaļā '

” elements, lai mainītu tā pozīciju uz vidēja un liela ekrāna:



< ķermeni >

< div klasē = 'h-96 mx-10 p-8 bg-sky-500' >
< img src = 'tailwindcss_img.png' klasē = 'float-left p-3 w-28 h-24' viss = 'attēls' / >

< img src = 'tailwindcss_img.png' klasē = 'peldēt pa labi p-3' viss = 'attēls' / >

< lpp klasē = 'text-justify clear-left md:clear-both lg:clear-none' > Tailwind CSS nodrošina 'peldošās' utilītas, lai kontrolētu satura ietīšanu ap elementu.
Šis piemērs parāda, kā lietot pārtraukuma punktus un multivides vaicājumus ar 'clear' utilītu programmā Tailwind. < / lpp >
< / div >

< / ķermeni >

Šeit:



  • 'peldēt pa kreisi' klase peld elementus uz konteinera kreiso pusi.
  • 'peldēt pa labi' klase peld elementus konteinera labajā pusē.
  • 'skaidri kreisi' klase pārvieto

    elementu zem kreisās puses peldošā elementa konteinerā.

  • 'md: notīrīt - abi' klase notīra gan kreiso, gan labo pludiņus un novieto

    elementu zem tiem uz vidēja izmēra ekrāna.

  • “lg:clear-none” klase atspējo jebkuru elementam

    lietoto notīrīšanu un ļauj elementam peldēt uz konteinera abām pusēm lielā ekrāna izmērā.

Izvade





Saskaņā ar iepriekš minēto rezultātu norādītie pārtraukuma punkti un multivides vaicājumi ir veiksmīgi piemēroti utilītai “clear”.

Secinājums

Lai lietotu pārtraukuma punktus un multivides vaicājumus “clear” utilītprogrammām programmā Tailwind, definējiet vēlamo vērtību “ notīrīt- ” utilīta dažādiem ekrāna izmēriem, izmantojot md ” vai “ lg ” pārtraukuma punkti. Lai veiktu verifikāciju, mainiet tīmekļa lapas ekrāna izmēru un nodrošiniet izmaiņas. Šajā rakstā ir parādīts piemērs konkrētu pārtraukuma punktu un multivides vaicājumu lietošanai programmā Tailwind “notīrītajām” utilītprogrammām.