CSS flex之flex-direction横向、竖向布局

flex direction CSS 属性 横向 竖向 布局 row column reverse 编程技术
发布日期 2022-10-24 更新日期 2022-10-24 阅读次数 131 文章字数 338

flex-direction 属性规定弹性项目的方向。

注释：如果元素不是弹性项目，则 flex 属性无效。

默认值： row
继承： 否
动画制作： 不支持。请参阅：动画相关属性。
版本： CSS3
JavaScript 语法： object.style.flexDirection="column-reverse"

CSS 语法

flex-direction: row|row-reverse|column|column-reverse|initial|inherit;

属性值

值 描述
row 默认值。作为一行，水平地显示弹性项目。
row-reverse 等同行，但方向相反。
column 作为列，垂直地显示弹性项目。
column-reverse 等同列，但方向相反。
initial 将此属性设置为其默认值。参阅 initial。
inherit 从其父元素继承此属性。参阅 inherit。

文章作者: 朱丰华

文章链接: https://smart.52dixiaowo.com/blog/post-142.html

版权声明: 本博客所有文章除特別声明外，均采用 CC BY 4.0 许可协议。

flex direction CSS 属性 横向 竖向 布局 row column reverse

发表评论

相关推荐
朱丰华   |   1年前   |   请求 · 一个

ab测压命令，apache测压工具

196    评论    点赞
朱丰华   |   1年前   |   < · iframe

让iframe嵌入的视频自适应 （100%宽度）？

138    评论    点赞
朱丰华   |   1年前   |   html · <

html浏览器当前tab标签切换时触发监听

117    评论    点赞
朱丰华   |   1年前   |   js · vue · 监听

js vue监听，深度监听

123    评论    点赞
朱丰华   |   1年前   |   php · 混淆 · obfuscate · git

yakpro-po混淆php代码

115    评论    点赞
朱丰华   |   1年前   |   vue · model

vue语法v-model原理与实现

131    评论    点赞
朱丰华   |   1年前   |   js · 模块 · nodejs

nodejs引入自定义模块

57    评论    点赞
朱丰华   |   1年前   |   php · 引用 · 变量 · c语言

php扩展内存管理与引用计数

139    评论    点赞
朱丰华   |   1年前   |   php · 混淆 · obfuscate · git

php代码混淆yakpro-po

244    评论    点赞
朱丰华   |   1年前   |   html

一行代码实现html网页整体缩放

188    评论    点赞
朱丰华   |   1年前   |   javascript · 属性 · 对象

javascript 判断对象是否拥有某个属性，删除某个属性

173    评论    点赞
朱丰华   |   2年前   |   css · 滚动

css控制内容溢出时横向滚动条

95    评论    点赞
朱丰华   |   2年前   |   table · layout · 属性 · 表格 · 布局 · 单元 · CSS · 宽度 · 内容 · 自动

CSS table-layout 属性

79    评论    点赞
朱丰华   |   2年前   |   < · th> · td> · for · 状态 · select · 选中 · 默认 · selected · >

v-for中select选中默认状态

57    评论    点赞
朱丰华   |   2年前   |   PDO · ATTR_EMULATE_PREPARES · 属性 · 设置 · false · 导致 · 错误

PDO::ATTR_EMULATE_PREPARES属性设置为false导致错误

102    评论    点赞
朱丰华   |   2年前   |   设计 · 搜索 · 数据库 · 第一 · 重要性 · 可以

数据库设计第一重要性，以搜索为设计

92    评论    点赞
朱丰华   |   2年前   |   inline · block · css · 区别 · 独占 · 一行 · margin · padding · line

css 之 inline 和 inline-block的区别

84    评论    点赞
朱丰华   |   2年前   |   居中 · 高度 · li · 垂直 · 基线 · css · 高等 · 容器 · 可以 · 行高

让 li 的 a 居中，css行高等于容器高度可以垂直居中

71    评论    点赞
朱丰华   |   2年前   |   样式 · 用户 · 代理 · css · 填坑 · 浏览器

css填坑，用户代理样式表

195    评论    点赞
朱丰华   |   2年前   |   表格 · 撑开 · css · 防止 · 太大 · border · break · 考虑 · table

css防止表格太大撑开

55    评论    点赞
{{item.author_name}}   |   {{new Date(item.date*1000).log()}}   |   {{it}} ·

{{item.title}}

{{item.uv}}    评论    点赞