HTML-响应式基本用法

2024-10-13 22:47:17

1、打开Dreamweaver软件,新建一个HTML文件

HTML-响应式基本用法

3、建立CSS样式,添加对div的一些修饰,如图将图形设置为一个矩形,填充红色

HTML-响应式基本用法

5、然后添加响应式代码,固定搭配 @media(max-width:800){}小辖艮鲔鸣括号内添加条件,最大或最小 ;大括号内添加转换后效果属性

HTML-响应式基本用法

7、然后保存在浏览器中查看效果,默认时是红色矩形,当拖动浏览器窗口到800px时,发生变化,转为蓝色小矩形。

HTML-响应式基本用法
猜你喜欢