Css transition

Question

In css course the were such code:
div {
width: 50px;
height: 50px;
background: #32CD32;
transition: width 3s;
-webkit-transition: width 3s;
}
div:hover {
width: 250px;
}

But there was nothing said about how transition works with pseudo classes. For example how can I make different transition durations for different events (pseudo classes)?

Answer 1

Actually I googled and didn't find the information how to use different transition durations for different events

Answer 2

Well this is the way. But it's not transition, it's animation.