今天看视频学习的时候，发现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. 第一讲：Git分区，配置与日志

    前言 曾经听到过这样一句话:不会git就不要敲代码了.细细品味确实有其中的道理,可能是当事人代码被强行覆盖后的叹息吧! 因此,为了避免这种情况,接下来我们就一起来好好学习git的相关知识吧!不怕你不会 ...

  2. Java引用的分类

    Java引用分为强引用.软引用.弱引用和虚引用. 强引用就是指在程序代码中普遍存在的,类似“Object obj = new Object()”这类的引用,只要强引用还存在,垃圾收集器永远不会回收掉被 ...

  3. Linux搜索工具

                                                                Linux搜索工具 Search搜索工具 yum search all vim  ...

  4. 小猪佩奇C代码实现

    // ASCII Peppa Pig by Milo Yip #include <stdio.h> #include <math.h> #include <stdlib. ...

  5. Java入门第一阶段总结

    前言 写了三周的模拟题,对原本就厌恶的模拟更加深恶痛绝.但是不得不说模拟题是对一门语言入门掌握其语法成效最快的一类题,轻松地从C入门到了Java.一直坚信各门语言都是想通的,一力破万法. 作业过程总结 ...

  6. Nikto使用方法

    Introduction Nikto是一款开源的(GPL)网站服务器扫描器,使用Perl基于LibWhisker开发.它可以对网站服务器进行全面的多种扫描,包括6400多个潜在危险的文件/CGI,检查 ...

  7. L3 多层感知机

    **本小节用到的数据下载 1.涉及语句 import d2lzh1981 as d2l 数据1 : d2lzh1981 链接:https://pan.baidu.com/s/1LyaZ84Q4M75G ...

  8. Feature list, Standard and Test plan for BETA Release 12/22/2015

    ===================BETA RELEASE FEATRURE LIST==================== 1. Log in and account manager for ...

  9. stand up meeting 11/23/2015

    组员 周末工作 工作耗时/h 明日计划 计划耗时/h 冯晓云 完成网络状况的侦听,对网络连接断开,WiFi状况不佳,未查询到结果设定不同的返回码,按约定格式返回:对于超时未查询进行了相关的学习: 3 ...

  10. Key Set HDU - 5363

    这个题目套公式 2^(n-1)-1,再来个快速幂基本上就可以AC了 写这个题目的: 公式容易推到错: 容易写成 2^n-1/2...这样写出来结果也不错  但是一直哇 AC: #include< ...