პოპულარული წინასწარ დაყენებული პარამეტრები

გაქრობის ეფექტი

გლუვი გადასვლის გამჭვირვალობა

მასშტაბის ეფექტი

ელემენტის ზომის შეცვლა მაუსის გადატარებისას

როტაციის ეფექტი

ელემენტის შეტრიალება მაუსის გადატარებისას

სლაიდის ეფექტი

ელემენტის პოზიციის გადატანა

ფერის შეცვლა

ფონის ფერის გადასვლა

გადასვლების შესახებ

CSS გადასვლები საშუალებას გაძლევთ შეუფერხებლად შეცვალოთ თვისებების მნიშვნელობები მოცემული ხანგრძლივობის განმავლობაში.

ხშირად ანიმაციური თვისებები მოიცავს:

  • სიგანე, სიმაღლე
  • ზღვარი, შევსება
  • გამჭვირვალობა, ფერი
  • transform (scale, rotate, translate)
  • background-color

პროფესიონალის რჩევა: ყველა ცვლილების ანიმაციისთვის გამოიყენეთ „ყველა თვისების“ ოფცია.

Preview

HOVER ME

გენერირებული კოდი

.element { transition-property: all; transition-duration: 300ms; transition-timing-function: ease; transition-delay: 0ms; }  .element:hover { /* Hover styles will be generated here */ }

გადასვლის კონტროლი

300
0

მაუსის გადატარების ეფექტები

100%
100%
0px
0px
8px
8px

Related Tools

შექმენით იდეალური Flexbox განლაგებები

ვიზუალიზაცია გაუკეთეთ, პერსონალიზირება გაუკეთეთ და გენერირება გაუკეთეთ CSS flexbox კოდს ჩვენი ინტუიციური გადათრევის და ჩაშვების ინტერფეისის გამოყენებით.

სტილუსის CSS-ში გადამყვანი

გარდაქმენით თქვენი SCSS კოდი CSS-ად. სწრაფად, მარტივად და უსაფრთხოდ.

CSS-ის გალამაზება

დააფორმატეთ და გაალამაზეთ თქვენი CSS კოდი პროფესიონალური სიზუსტით

შენახვის სიმკვრივის ერთეულის გადამყვანი

მონაცემთა შენახვის სიმკვრივის სხვადასხვა ერთეულებს შორის ზუსტი კონვერტაცია

HEX-დან RGB-მდე

ვებ-განვითარებისთვის HEX ფერის კოდების RGB მნიშვნელობებად გადაქცევა

CSS ფილტრის გენერატორი

შექმენით და ვიზუალიზაცია გაუკეთეთ CSS-ის საკუთარი სურათების ფილტრებს