微信小程序开发之搞懂flex布局2——flex container
容器的概念,是用来包含其它容器(container)和项目(item)。
flex container——flex容器
A flexbox layout is defined using the flex or inline-flex values of the display property on the parent item. This element then becomes a flex container, and each one of its children becomes a flex item.
给view(在小程序中用view,h5里用div)的display属性设置为flex或inline-flex,这个view就成了flex容器,view里的元素就成了flex item。
A value of flex causes the element to become a block level flex container, and inline-flex an inline level flex container. These values create a flex formatting context for the element, which is similar to a block formatting context in that floats will not intrude into the container, and the margins on the container will not collapse with those of the items.
设置为display:flex时,是块级弹性容器;设置为display:inline-flex时,是行内级弹性容器。
微信小程序开发之搞懂flex布局2——flex container的更多相关文章
- 微信小程序开发之搞懂flex布局1——Flexbox
Flexbox ——弹性布局 Flexbox is a layout model for displaying items in a single dimension — as a row or as ...
- 微信小程序开发之搞懂flex布局3——Flex Item
Flex Item flex容器的子元素就是这个容器的flex item. The direct children of a Flex Container (elements with display ...
- 微信小程序开发之搞懂flex布局4——Main Axis
Main Axis——主轴 当flex-direction设置为row或row-reverse时,主轴的方向为水平方向.此时flex item为行内级元素. 当flex-direction设置为col ...
- 微信小程序开发之搞懂flex布局5——cross axis
Cross Axis——交叉轴,与Main Axis(主轴)垂直交叉. main axis is row or row-reverse the cross axis runs down the col ...
- 剖析简易计算器带你入门微信小程序开发
写在前面,但是重点在后面 这是教程,也不是教程. 可以先看Demo的操作动图,看看是个什么玩意儿,GitHub地址(https://github.com/dunizb/wxapp-sCalc) 自从微 ...
- 【微信小程序开发】秒懂,架构及框架
今天1024程序员节,写文章庆祝!!! 今天的文章是讲微信小程序开发的,按理解把架构与框架说说.有不对之处请大神指点…… 微信小程序与web应用很像,但是原理不同,微信小程序是运行在微信应用内的,不是 ...
- 微信小程序开发总结(一)
微信小程序从2016年9月21日开始内测 ,以及在2017年1月9号正式发布也有一段时间了, 很多人开始拥抱微信小程序,我也是一样 ,从微信小程序内测开始就加入进来 , 开始研究微信小程序 ,属于最早 ...
- 微信小程序开发学习资料
作者:初雪链接:https://www.zhihu.com/question/50907897/answer/128494332来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明 ...
- 【微信小程序开发•系列文章六】生命周期和路由
这篇文章理论的知识比较多一些,都是个人观点,描述有失妥当的地方希望读者指出. [微信小程序开发•系列文章一]入门 [微信小程序开发•系列文章二]视图层 [微信小程序开发•系列文章三]数据层 [微信小程 ...
随机推荐
- 2018-2019-2 网络对抗技术 20165304 Exp5 MSF基础应用
2018-2019-2 网络对抗技术 20165304Exp5 MSF基础应用 原理与实践说明 1.实践原理 1).MSF攻击方法 主动攻击:扫描主机漏洞,进行攻击 攻击浏览器 攻击其他客户端 2). ...
- sqlserver一些对象的创建
1.db_link 一 如何创建Dblink1)SQLServer 到 SQLServerExec sp_droplinkedsrvlogin PDALink,Null --删除映射(录与链接服务器上 ...
- Linux 下安装 tomcat
前提:已经安装配置好了 JDK 1.下载二进制文件 wget http://us.mirrors.quenda.co/apache/tomcat/tomcat-9/v9.0.19/bin/apache ...
- Spring.xml中配置注解context:annotation-config和context:component-scan简述
XML中context:annotation-config和context:component-scan简述 <context:annotation-config/> 中文意思:<上 ...
- React16的interactiveUpdates
交互式更新是用户交互的结果. 它们比默认的非交互式更新(如服务器事件)具有更高的优先级. 异步模式下交互式更新的特殊之处在于,一次交互式更新可能会影响后续行为. 例如,一个表单字段上的"提交 ...
- 自然语言推断(NLI)、文本相似度相关开源项目推荐(Pytorch 实现)
Awesome-Repositories-for-NLI-and-Semantic-Similarity mainly record pytorch implementations for NLI a ...
- Linux 添加中文字体库,解决Java 生成中文水印不显示问题
本机 Windows 环境测试以下代码生成中文水印完全没问题,但是发布到Linux下不显示,一开始以为是报错了没打印出来,搜索发现直接提示中文乱码的或者不显示的,才明白原来是字体库原因,于是开始解决这 ...
- docker swarm 集群及可视化界面的安装及配置
docker swarm 集群及可视化界面的安装及配置 2016-12-14 16:08:46 标签:swarm consul registrator 原创作品,允许转载,转载时请务必以超链接形式标明 ...
- BackgroundWorker 组件 -- 进度条
代码: BackgroundWorker bw = new BackgroundWorker(); public MainWindow() { InitializeComponent(); bw.Wo ...
- Windows内核开发之串口过滤
学习了几个月的内核编程,现在对Windows驱动开发又了更加深入的认识,特别是对IRP的分层处理逻辑有了深入认识. 总结起来就几句话: 当irp下来的时候,你要根据实际情况,进行处理 1> 无处 ...