How to make the background of website changes when opened with phone?

Question

i need to know how to make the web page background changes when the it's opened with a phone

this is my try but it didn't work :

<style>
@media only screen and (max-width: 768px) {
  body {
    background-color: blue;
  }
</style>