Dobry prefixer CSS

pytanie zadane 15 kwietnia 2015 w HTML i CSS przez Robert Saternus Stary wyjadacz (12,180 p.)

Siemanko.

Znacie jakiś dobry prefixer CSS, aby obsługiwał wszystkie prefiksy (nie tylko webkit-u)? Zawsze używałem http://prefixr.com ale coś się ostatnio posypał :/

3 odpowiedzi

odpowiedź 15 kwietnia 2015 przez Valtuil Pasjonat (22,460 p.)
wybrane 15 kwietnia 2015 przez Robert Saternus

Najlepsza

http://pleeease.io/play/

komentarz 15 kwietnia 2015 przez Robert Saternus Stary wyjadacz (12,180 p.)

Spróbuj przetworzyc taki kod:


@keyframes "earth-rotation" {
    0% {
                transform: rotate(0deg);
    }
    
    100% {
        
                transform: rotate(360deg);
    }
}

mi zwraca tylko wersje dla webkit-a

komentarz 15 kwietnia 2015 przez Valtuil Pasjonat (22,460 p.)

Wystarczy w prawym erkanie w zakładce autoprefixer dopisać "> 0%"

Wynik:

@-webkit-keyframes "earth-rotation" {
    0% {
                -webkit-transform: rotate(0deg);
                        transform: rotate(0deg);
    }
     
    100% {
         
                -webkit-transform: rotate(360deg);
         
                        transform: rotate(360deg);
    }
}
@-moz-keyframes "earth-rotation" {
    0% {
                -moz-transform: rotate(0deg);
                     transform: rotate(0deg);
    }
     
    100% {
         
                -moz-transform: rotate(360deg);
         
                     transform: rotate(360deg);
    }
}
@-o-keyframes "earth-rotation" {
    0% {
                -o-transform: rotate(0deg);
                   transform: rotate(0deg);
    }
     
    100% {
         
                -o-transform: rotate(360deg);
         
                   transform: rotate(360deg);
    }
}
@keyframes "earth-rotation" {
    0% {
                -webkit-transform: rotate(0deg);
                   -moz-transform: rotate(0deg);
                     -o-transform: rotate(0deg);
                        transform: rotate(0deg);
    }
     
    100% {
         
                -webkit-transform: rotate(360deg);
         
                   -moz-transform: rotate(360deg);
         
                     -o-transform: rotate(360deg);
         
                        transform: rotate(360deg);
    }
}

komentarz 15 kwietnia 2015 przez Robert Saternus Stary wyjadacz (12,180 p.)

Dzięki! Działa jak należy. Możesz wytłumaczyć co oznacza ten zapis: "> 0%" ?

komentarz 15 kwietnia 2015 przez Valtuil Pasjonat (22,460 p.)

Prefixer klasyfikuje wersje przeglądarek według popularności. Zapis "> 0%" oznacza "pokaż prefixy dla przeglądarek z udziałem większym niż 0%".

odpowiedź 15 kwietnia 2015 przez Geek Pasjonat (19,660 p.)

http://cssprefixer.appspot.com/

Prosty, przejrzysty i działa :)

komentarz 15 kwietnia 2015 przez Robert Saternus Stary wyjadacz (12,180 p.)

Właśnie trochę kiepsko działą. Spróbój z przykładem powyżej. ^^

odpowiedź 16 kwietnia 2015 przez testerius Pasjonat (23,960 p.)

Możesz również poszukać czy czasem do twojego edytora nie ma już takiego dodatku, pluginu, gdzie za pomocą kombinacji klawiszy dodasz sobie prefiksy. Z tego co wiem to taka możliwość jest na 99% w Sublime Text, jest jakiś package tylko zapomniałem już jak się nazywa. Jeśli ktoś wie to niech napisze. ;P