为什么值兼容谷歌 急

Question

.map g:hover{ -webkit-animation: bb 2s alternate infinite; -moz-animation: bb 2s alternate infinite; -ms-animation: bb 2s alternate infinite; -o-animation: bb 2s alternate infinite;    animation: bb 2s alternate infinite;}@-webkit-keyframes bb{    25%{        fill: rgba(0, 153, 255, 0.8);        -webkit-transform-origin: 50% 50%;        -webkit-transform:scale(1.2);    }    50%{    -webkit-transform-origin: 50% 50%;    }    75%{    -webkit-transform-origin: 50% 50%;    -webkit-transform:scale(1.5);    100%{    -webkit-transform-origin: 50% 50%;    }}@-moz-keyframes bb{    25%{        fill: rgba(0, 153, 255, 0.8);        -moz-transform-origin: 50% 50%;        -moz-transform:scale(1.2);    }    50%{        -moz-transform-origin: 50% 50%;    }    75%{        -moz-transform-origin: 50% 50%;        -moz-transform:scale(1.5);    }    100%{        -moz-transform-origin: 50% 50%;    }}@-ms-keyframes bb{    25%{        fill: rgba(0, 153, 255, 0.8);        -ms-transform-origin: 50% 50%;        -ms-transform: scale(1.2);    }    50%{        -ms-transform-origin: 50% 50%;    }    75%{        -ms-transform-origin: 50% 50%;        -ms-transform: scale(1.5);    }    100%{        -ms-transform-origin: 50% 50%;    }}@-o-keyframes bb{    25%{        fill: rgba(0, 153, 255, 0.8);        -o-transform-origin:50% 50%;        -o-transform:scale(1.2);    }    50%{        -o-transform-origin:50% 50%;    }    75%{        -o-transform-origin:50% 50%;        -o-transform:scale(1.5);    }    100%{        -o-transform-origin:50% 50%;    }}@keyframes bb{    25%{        fill: rgba(0, 153, 255, 0.8);        transform-origin:50% 50%;        transform:scale(1.2);    }    50%{        transform-origin:50% 50%;    }    75%{        transform-origin:50% 50%;        transform:scale(1.5);    }    100%{        transform-origin:50% 50%;    }}

Answer 1

为什么只兼容谷歌？因为这个css用了大量的-webkit-，-webkit-头并不是css标准属性，是webkit内核自有的。-moz-头也是如此，是火狐自有的。