Both pseudo selectors allow you to match elements based on their position within a parent element’s list of child elements. They accept an argument that can be a number, the keywords “even” or “odd” or a formula (an+b), and they iterate through all the children of the parent and select the matching elements.
Here we can see some examples of each one:
In these examples both selectors are doing the same because all the children are the same kind of elements (li tags). In this other example, we can see the difference between them:
The difference is that :nth-child can select any sibling element in an arrangement, not only elements that are specified before the colon, while :nth-of-type targets a particular type of element in an arrangement with relation to similar siblings, not all siblings.