现如今，响应式设计愈发流行。有一个重要的原因便是，现在用手机、用平板上网的人越来越多了，所以站长们为了让访客有一个良好的上网体验，就会让网站根据对应的上网设备、对应的窗口尺寸显示不同但都很养眼的网页。
要用代码去实现它也是非常简单的一件事，下面我只挑最简单的代码，让大家感受下哈。
让网页根据窗口尺寸更改大小比如我要那一个文章阅读的网页，这个文章正文是用一个容器所包含着：
正文内容
现在来设计这个容器的css样式，这里我就只设置一个宽度的属性：
[html]#read{
width:690px;
}[/html]
现在它只是一个普通的网页，窗口的区域并不会随着窗口尺寸大小的更改而更改，我们只要给它加上非常简单的代码，就能够实现流动式的窗口布局了：
[html]@media screen and (max-width:690px){
#read{
width:100%;
}
}[/html]
就这么简单，这句代码的意思便是当屏幕窗口尺寸小于690px时，id为read的这个容器的宽度便会为100%，也就是宽度随着窗口的尺寸更改而更改。
