Jak zastosować „włamanie” podczas zawisu w Tailwind?

W tym artykule zilustrujemy metodę zastosowania „break-inside” po najechaniu kursorem w CSS Tailwind.

Jak zastosować „włamanie” podczas zawisu w Tailwind?

Aby zastosować „break-inside” po najechaniu kursorem w Tailwind, użyj właściwości „hover” z określonym narzędziem „break-inside” na żądanych elementach w programie HTML. Następnie wyświetl stronę internetową w celu weryfikacji.

Aby uzyskać praktyczną demonstrację, wypróbuj poniższe kroki:

Krok 1: Użyj właściwości Hover z narzędziem „break-inside”.
Utwórz program HTML i wykorzystaj „ unosić się ” z żądanym narzędziem „włamania”. Na przykład użyliśmy właściwości hover z „ unikaj-kolumny-włamania ”, aby uniknąć podziału kolumny w elemencie

po najechaniu kursorem:

Tutaj:

• “ kolumny-2 ” służy do podziału
  na dwie kolumny.
• “ bg-żółty-500 ” klasa ustawia żółty kolor tła elementu
  .
• “ najechanie kursorem: włamanie do kolumny unikaj ” w elemencie

  wskazuje, że po najechaniu kursorem myszy należy unikać podziału kolumny w elemencie

  .

Krok 2: Sprawdź dane wyjściowe
Aby sprawdzić, czy narzędzie „break-inside-avoid-column” zostało pomyślnie zastosowane po najechaniu kursorem, wyświetl stronę HTML:

Powyższe dane wyjściowe pokazują, że gdy użytkownik najechał kursorem na żądany element, uniknięto podziału kolumny w elemencie. Oznacza to, że „break-inside-avoid-column” zostało pomyślnie zastosowane do elementu po najechaniu kursorem, zgodnie z którym został określony.

Wniosek

Aby zastosować „włamanie” po najechaniu kursorem w Tailwind, użyj „ unosić się ” nieruchomość o pożądanym „ włamanie ” w programie HTML. Właściwość hover może być używana z dowolnym elementem. W celu weryfikacji przejrzyj stronę internetową. W tym artykule wyjaśniono metodę zastosowania „włamania” po najechaniu kursorem w CSS Tailwind.