今天看视频学习的时候,发现css有一个 flex 的属性,非常的好用,为了让自己能够熟记,特意来分享一下flex的用法。
首先,采用Flex布局的元素,称为Flex容器(flex container),简称”容器”。它的所有子元素自动成为容器成员,称为Flex项目(flex item),简称”项目”。
容器一共有有6个属性,分别是flex-direction、flex-wrap、flex-flow、justify-content、align-items、align-content。其中(justify-content和align-items)结合可以完成不定宽高的水平垂直居中韩国,非常方便简洁。
项目也有6个属性,分别是order、flex-grow、flex-shrink、flex-basis、flex、align-self。
具体例子可以查看[菜鸟教程](http://www.runoob.com/w3cnote/flex-grammar.html)

flex学习的更多相关文章

  1. 【转】【Flex】FLEX 学习网站分享

    [转:http://hi.baidu.com/tanghecaiyu/item/d662fbd7f5fbe02c38f6f764 ] FLEX 学习网站分享 http://blog.minidx.co ...

  2. flex学习小结

    接触到flex一个多月了,今天做一个学习小结.如果有知识错误或者意见不同的地方.欢迎交流指教. 画外音:先说一下,我是怎么接触到flex布局的.对于正在学习的童鞋们,我建议大家没事可以逛逛网站,看看人 ...

  3. CSS3伸缩布局Flex学习笔记

    如果需要使用伸缩布局首先得把display:flex;对于兼容还得加前缀display:-webkit-display:flex;等其他浏览器前缀,但我本机Chrome测试已经不需要加前缀了,其实这些 ...

  4. 【Flex学习】Flex4学习网站

    http://blog.minidx.com/category/flex  来自为知笔记(Wiz)

  5. Flex学习总结

    Flex SDK Flex框架类库.Flex编译环境.调式器.MXML.ActionScript编程语言以及其它工具组成,Flash Builder是其开发环境,   Flash Player的工作模 ...

  6. Flex学习第一天(两个数相加)

    <?xml version="1.0" encoding="utf-8"?><s:Application xmlns:fx="htt ...

  7. Flex学习教程网站地址

    http://www.985school.com/flex/complex_controls.html

  8. flex学习网站地址

    http://hacker47.iteye.com/blog/213887 http://www.cuplayer.com/player/PlayerCode/Flex/ http://bbs.9ri ...

  9. flex学习, 尝试布局一个计算器

    <!DOCTYPE html> <html> <head> <title>flex</title> </head> <st ...

随机推荐

  1. Shell基础应用

                                                                  Shell基础应用 案例1:Shell基础应用 案例2:简单Shell脚本的 ...

  2. app测试的一些较为重要的测试点

    安装测试 从不同的手机所自带的不同的版本的软件商城里面下载抖音并安装查看是否成功 安装后是否能正常运行安装后的文件和文件夹是否写到了指定的目录里 安装过程中取消安装,安装的文件是否在指定的目录里 安装 ...

  3. Nordic nRF52820超低功耗蓝牙5.2 SoC芯片-低端无线连接方案首选

    nRF52820是功耗超低的低功耗蓝牙 (Bluetooth Low Energy /Bluetooth LE).蓝牙mesh.Thread.Zigbee和2.4 GHz专有低端无线连接解决方案.nR ...

  4. 【前端】CSS总结

    ========================   CSS层叠样式表======================== 命名规则:使用字母.数字或下划线和减号构成,不要以数字开头 一.css的语法-- ...

  5. spring初级java 应用。搭建环境。基本语法

    搭建环境完成之后.使用spring config editor打开配置的spring xml文件. 自己实现了,spring在java上的一些基本的应用.一共看了四节视频.下面是自己实现的编码: 最基 ...

  6. android注册验证码的使用

    主要是创建了验证码的生成类. 通过此生成类,与imageview相互联系起来,实现验证码显示.并添加点击事件,实现验证码的切换. 实验的截图如下:(验证码可以点击切换) 具体的关于验证码的生成类如下: ...

  7. python3(一)

    print('test', '怎么自动建了这么多目录', 'aaaaaaa') #test 怎么自动建了这么多目录 aaaaaaa 注释# # ---------------------------- ...

  8. Django-rest-framework 是个什么鬼?

    作者:HelloGitHub-追梦人物 我们首先来回顾一下传统的基于模板引擎的 django 开发工作流: 绑定 URL 和视图函数.当用户访问某个 URL 时,调用绑定的视图函数进行处理. 编写视图 ...

  9. Property [*****] not found on type [com.erp.pojo.ErpSupplier]

    我实体类里用的是 springboot 里@Slf4j   @Data  注解式写的  这样可以减少代码量 ,但是遇到一个问题影响我好长时间 出现了这个错误  Property [*****] not ...

  10. 使用Scanner接受用户键盘输入的值

    第一步导入Scanner import java.util.*; 第二步创建Scanner对象 Scanner input = new Scanner(System.in); 第二步创建Scanner ...