Responsive Design Örnek Tasarım

HTML KODLARI

<body>


<div id=”wrapper”>


<h1> Responsive test For Seo Blog </h1>


</div>

</body>

CSS BÖLÜMÜ

@media screen and (min-width:0px){

#wrapper{width:500px; height:150px; margin:auto; background:#00F; color:#fff; font-size:14px; text-align:center; }
}

@media screen and (min-width:1000px){

#wrapper{width:960px; height:400px; margin:auto; background:#00F; color:#fff; font-size:18px; }
}


@media screen and (min-width:1300px){

#wrapper{width:1100px; height:400px; margin:auto; background:#00F; color:#fff; font-size:24px; }
}