今天看视频学习的时候,发现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. Java基础知识2-Java基本语法

    数据类型 1.Java程序的基本组成 关键字:被Java语言赋予特定含义的单词,不能作标识符,如private. 标识符:由数字.字母.$和_组成的字符串,用于引用变量.且首字母不能是数字. 变量:程 ...

  2. 普通企业的规划类项目中,OptaPlanner更适合作为APS的规划优化引擎

    在企业的规划.优化场景中,均需要开发规划类的项目,实现从从种可能方案中找出相对最优方案.如排班.生产计划(包括高层次的供应链优化,到细粒度的车间甚至机台作业指令).车辆调度等.因为这类场景需要解决的问 ...

  3. Java8 新特性 Lambda & Stream API

    目录 Lambda & Stream API 1 Lambda表达式 1.1 为什么要使用lambda表达式 1.2 Lambda表达式语法 1.3 函数式接口 1.3.1 什么是函数式接口? ...

  4. .NET项目升级手记:可为空引用

    c# 8引入了新特性:"可为空引用"(详情),这个功能个人觉得挺好的,能够非常明确的表现程序设计者的意图,编译器能够进行检查,尽最大可能减小NullReferenceExcepti ...

  5. 【linux】阿里云防火墙相关

    1. 需现在阿里云安全组策略中开启相应端口,80.3306等. 2. 想用外网访问3306需开启权限,进入mysql键入 GRANT ALL PRIVILEGES ON *.* TO 'myuser' ...

  6. djangoRestFrameWork的小知识

    djangoRestFrameWork的小知识 重写序列化器的save方法 有时候,.create()和.update()方法名称可能没有意义.例如,在联系表格中,我们可能没有创建新实例,而是发送了电 ...

  7. Java第五天,API常用类,静态(static)、集合(ArrayList)、日期(Date)、日历(Calendar)的使用方法

    上文中我们学习到了Random随机数类和ArrayList<E>集合.这两个知识点都是经常用到的,那么除了这两个外,还有哪些知识点是我们所必须掌握的呢? static 使用static需要 ...

  8. 躁!DJ 风格 Java 桌面音乐播放器

    本文适合有 Java 基础知识的人群,跟着本文可学习和运行 Java 版桌面 DJ 音乐播放器. 本文作者:HelloGitHub-秦人 HelloGitHub 推出的<讲解开源项目>系列 ...

  9. Win8.1/Win10在某些程序输入中文变成问号的解决方法

    之前我是使用Win8.1,在某些软件上输入中文,却显示问号,换输入法也没用,当时也没用太在意,后来升级到Win10还是一样.同样的软件在其它Win8.1/Win10电脑却可以正常显示中文. 解决方法如 ...

  10. 猜数字和飞机大战(Python零基础入门)

    前言 最近有很多零基础初学者问我,有没有适合零基础学习案例,毕竟零基础入门的知识点是非常的枯燥乏味的,如果没有实现效果展示出来,感觉学习起来特别的累,今天就给大家介绍两个零基础入门的基础案例:猜数字游 ...