how to make a responsive page code example

Example 1: responsive page

/*Default CSS layout for narrow screens*/

@media (min-width: 480px) {
  /*CSS for medium width screens*/
}

@media (min-width: 800px) {
  /*CSS for wide screens*/
}

@media (min-width: 1100px) {
  /*CSS for really wide screens*/
}

Example 2: make it responsive

<div id="gallery">
            <div class="showcase-images">
                <div class="showcase-block">
            <img id="show-img" src="images/showcase/tabs.png" alt="Tabs">
            </div>
            </div>
            <nav>
            <ul id="main">
                <li id="tabs"><a href="#">Tab</a></li>
                <li id="login"><a href="#">Login</a></li>
                <li id="forum"><a href="#">Forum</a></li>
            </ul>
        </nav>
        </div>