Kuinka käyttää 'murtoa sisään' Hoverissa Tailwindissä?

Tämä artikkeli on esimerkki menetelmästä, jolla 'break-inside' käytetään leijuttaessa Tailwind CSS:ssä.

Kuinka käyttää 'murtoa sisään' Hoverissa Tailwindissä?

Jos haluat käyttää 'break-inside' -toimintoa leijuttaessa Tailwindissä, käytä 'hover'-ominaisuutta 'break-inside' -apuohjelman kanssa halutuissa elementeissä HTML-ohjelmassa. Tarkastele sitten verkkosivua vahvistusta varten.

Käytännön esittelyä varten kokeile alla lueteltuja vaiheita:

Vaihe 1: Käytä Hover Property -ominaisuutta 'break-inside' -apuohjelman kanssa
Luo HTML-ohjelma ja käytä ' leijuu ” omaisuutta halutulla ”murtaudu sisään” -apuohjelmalla. Olemme esimerkiksi käyttäneet hover-ominaisuutta ' murtaudu sisään-vältä sarake ” apuohjelma sarakkeen katkeamisen välttämiseksi

-elementin sisällä, kun hiiri on päällä:

Tässä:

• ' sarakkeet-2 ” -luokkaa käytetään jakamaan
  kahteen sarakkeeseen.
• ' bg-keltainen-500 ” luokka asettaa keltaisen värin
  :n taustalle.
• ' hover:break-inside-avoid-column ” luokka

  -elementissä osoittaa, että kun hiiren osoitin liikkuu sen päällä, sarakkeen vaihtoa tulee välttää

  -elementin sisällä.

Vaihe 2: Tarkista lähtö
Tarkista HTML-verkkosivulta, onko 'break-inside-avoid-column' -apuohjelma otettu käyttöön onnistuneesti viemällä hiiri:

Yllä oleva tulos osoittaa, että kun käyttäjä vie hiiren osoittimen halutun elementin päälle, elementin sisällä tapahtuva sarakkeen vaihto on vältetty. Tämä osoittaa, että 'break-inside-avoid-column' on onnistuneesti käytetty elementissä, jossa se on määritetty.

Johtopäätös

Käytä 'murto sisään' -toimintoa, kun hiiri Tailwindissä, käytä ' leijuu 'kiinteistö halutulla' murtautua sisään ”-apuohjelma HTML-ohjelmassa. Hover-ominaisuutta voidaan käyttää minkä tahansa elementin kanssa. Tarkista verkkosivulta. Tässä artikkelissa on selitetty menetelmä 'break-inside' käyttämiseen leijuttaessa Tailwind CSS:ssä.