第二章:CSS基础进阶-part3:弹性例子布局

文章目录

  • Flex盒模型
  • 二、常见属性
    • [2.1 flex属性](#2.1 flex属性)
    • [2.2 justify-content](#2.2 justify-content)
    • [2.3 flex-wrap](#2.3 flex-wrap)
    • [2.4 flex-flow](#2.4 flex-flow)
    • [2.5 align-items](#2.5 align-items)
    • [2.6 父容器-align-content](#2.6 父容器-align-content)

Flex盒模型

1、普通盒模型

2、弹性盒布局

使用弹性盒布局能让容器的宽度跟随浏览器窗口的变化而变换

二、常见属性

2.1 flex属性

2.2 justify-content

2.3 flex-wrap

2.4 flex-flow

这是一个简写flex-direction和flex-wrap属性。共同定义了flex容器的主轴和交叉轴。默认是row nowrap。

2.5 align-items

2.6 父容器-align-content

相关推荐
前端fighter18 分钟前
深入解析CSS定位:Sticky与Fixed的异同与实战应用
前端·css·面试
本就是菜鸟何必心太浮23 分钟前
python中`__annotations__` 和 `inspect` 模块区别??
java·前端·python
Jerry23 分钟前
Compose Material Design 系统
前端
Coodor24 分钟前
碰一下可打开小程序,在web系统中如何嵌入将小程序写入NFC
前端·小程序·nfc
高端章鱼哥24 分钟前
很简单,MySQL安装指南
前端·mysql
雾岛听风来31 分钟前
你真的知道 Java 里的 Exception 和 Error 有啥不同吗?
前端
维维酱32 分钟前
React.memo 实现原理解析
前端·react.js
前端拿破轮1 小时前
从零到一开发一个Chrome插件(三)
前端·chrome·浏览器
94very1 小时前
iframe实践
前端
用户85759414500291 小时前
产品让你写段炫彩炫酷的字体效果,你该怎么做?回答我?
前端