响应式布局是什么（如何实现响应式布局）

1.什么是响应式布局？

响应式页面布局就是指网站不会随着终端的不同去变化，目的是解决移动端互联网浏览的问题，通俗的来说，就是一个html网站能兼容很多版本的手机和电脑等终端。

2.响应式布局举例1：

1）首先我们新建一个div标签，并设高度和背景颜色：

2）通过媒体查询控制页面的宽度：

①当页面宽度为小于768像素的时候，div的宽度100%显示：

②当页面宽度为大于768像素的时候，div的宽度为750像素：

③当页面宽度为大于992像素的时候，div的宽度为970像素：

④当页面宽度为大于1200像素的时候，div的宽度为1170像素：

3.响应式布局举例2：

①我们首先新建一个div标签，然后里面装着9个li标签：

②我们设置父元素以及子元素的样式如下：

③我们通过媒体查询来控制页面的宽度，当页面宽度小于768像素的时候，父元素宽度变化：

下一篇：俄罗斯有苏联几成的实力（一文揭秘！苏联和现在的俄罗斯哪个强）
上一篇：开个不愁销路的小厂（开什么厂简单又赚钱）