I get this question a lot. I find it hard to answer in depth because these two technologies are so alike. The basic reply often become "Mvc is used to create websites and web API is used to create web APIs"".
You could also say that "MVC is meant to output HTML where Web API is meant to output raw data". It can be easy to mix them because they have so many similarities. Both mvc and web API consists of Controllers, Actions, Filters, Routes and can serve all sorts of data.
MVC projects come with css and javascript. Of course you can use MVC without this, but it gives you an idea of what the purpose is. Web API projects do not include this per default. They have no use for it as they are meant to output raw data (JSON / XML).
It is also possible to make web API output html and MVC to output data - but it will require some extra work and code. I have seen many mvc endpoints returning JSON.
Remember, that you can even have both web API and mvc in one project! You do not I have to choose. One does not exclude the other.
Since MVC 6 web API and MVC are unified into one.
I hope you liked this explanation, let me know in the comments if you did or if you for some reason did not!