soupirerdedame 发表于 2021-3-21 15:06

【笔记】 网页制作中的flex布局

设计div块进行垂直或者水平居中的布局时，使用flex比float方便的多，
      示例代码：
display: flex;
align-items: center; //垂直居中
justify-content: center; //水平居中
flex-direction: column;//对齐方向

fyypll 发表于 2021-3-21 16:21

本帖最后由 fyypll 于 2021-3-21 16:22 编辑

还有个网格布局也可以实现垂直水平居中
display: grid;
place-items: center;

也可以定位设置left和top为50%，然后设置translate实现垂直水平居中的
left: 50%;
top: 50%;
transform: translate(-50%, -50%);

jinlizhu 发表于 2021-3-21 16:36

简单的解决办法

673925543 发表于 2021-3-21 17:35

网格布局感觉还是没有弹性布局用的舒服
页: [1]
查看完整版本: 【笔记】 网页制作中的flex布局


免责声明：
吾爱破解所发布的一切破解补丁、注册机和注册信息及软件的解密分析文章仅限用于学习和研究目的；不得将上述内容用于商业或者非法用途，否则，一切后果请用户自负。本站信息来自网络，版权争议与本站无关。您必须在下载后的24个小时之内，从您的电脑中彻底删除上述内容。如果您喜欢该程序，请支持正版软件，购买注册，得到更好的正版服务。如有侵权请邮件与我们联系处理。

Mail To:Service@52pojie.cn