怎么制作一个响应式HTML网页

响应式HTML网页可以自动适应不同浏览设备而自动变化版面，下面介绍一下怎么制作一个响应式HTML网页的方法和步骤。

1. 打开Dreamweaver软件，新建一个HTML文件
2. 在body标签中建立一个盒标签div
3. 建立CSS样式，添加对div的一些修饰，如图将图形设置为一个矩形，填充红色
4. 将文件保存后，在浏览器中预览，效果如图所示
5. 然后添加响应式代码，固定搭配  @media(max-width:800){}小括号内添加条件，最大或最小 ；大括号内添加转换后效果属性
6. 这里将响应后发生的变化是：宽度降低到400px;高度为300px;颜色转为蓝色；如图所示设置
7. 然后保存在浏览器中查看效果，默认时是红色矩形，当拖动浏览器窗口到800px时，发生变化，转为蓝色小矩形。