CSS Media Queries ADDING SCROLLBAR

i am trying to create a webpage that will use Media Queries to be responsive , i dont understand the concept that i have found about media queries absolutely ... but basicaly lets imagine that we have a basic website with some images and buttons i have seen some examples of using media queries , one of them is that we can detect resolution and if its smaller as for example min-width: 480px then we can use different css file or so , it means we have to rewrite the whole webpage 10 times in different layout , cant we just do that if the smaller resolution is detected then it will just add scrollbars ? so the webpage wont move its components but if the resolution gets smaller it will just add scrollbars , i have also seen code for it it uses overflow-x and same for y but it doesnot work for me

 @media screen and (min-width: 480px) {
        body {
           /*CODE GOES HERE*/
        }
    }