前端的第十一天(移动端的特点、百分比布局、Flex布局、实战演练)

前端的第十一天(移动端的特点、百分比布局、Flex布局、实战演练)

在这里插入图片描述

一、移动端特点

1、移动端和PC端网页不同点

在这里插入图片描述

2、谷歌模拟器在这里插入代码片

在这里插入图片描述

3、分辨率

在这里插入图片描述
在这里插入图片描述

4、视口

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

5、二倍图

在这里插入图片描述
在这里插入图片描述

二、百分比布局

在这里插入图片描述

三、Flex布局

1.Flex布局

在这里插入图片描述
查询CSS、JS、HTML5、CSS、SVG在个中流行浏览器钟的特性和兼容性的网站
Can I Use,点我跳转
在这里插入图片描述
在这里插入图片描述

2、主轴对齐方式:justify-content

在这里插入图片描述

3、侧轴对齐方式:align-items

在这里插入图片描述

4、伸缩比

在这里插入图片描述

四、实战演练

在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/m0_56901161/article/details/121361916