6/25Flex四色块布局

一、最终效果
页面居中一个大框，里面 4个方块横向并排、宽度一模一样，颜色依次：红、橙、黄、绿，中间有数字1、2、3、4。
二、运行代码

flex弹性布局
1
2
3
4
三、核心 1、父盒子加 **display: flex;** —— 让里面的盒子 **横着排**（不加就竖着堆）

2、子盒子加 flex: 1; —— 所有盒子 平分宽度、一样宽
四、每一句代码解释
1、页面固定开头

网页文件声明 网页最大外壳 <head> 网页头部（放样式、看不见）

防止中文乱码

<title>xxx</title> 浏览器标签名字
posted @ 2026-06-25 09:00  一个用户jelly  阅读(11)  评论(0)    收藏  举报