今天看视频学习的时候，发现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. python 终端带颜色的打印文本

    import sys from termcolor import colored, cprint text = colored('Hello, World!', 'red', attrs=['reve ...

  2. es分页条数限制

    "error": { "root_cause": [ { "type": "query_phase_execution_excep ...

  3. spring 中 hibernate 的 2种 配置方式（新旧 2种方式）

    Spring对hibernate配置文件hibernate.cfg.xml的集成,来取代hibernate.cfg.xml的配置 Spring对hibernate配置文件hibernate.cfg.x ...

  4. stand up meeting 12-11

    今天因组员时间问题,并没有集中在一起开会,但士杰当面和天赋同学进行了沟通,在lync与国庆进行了沟通. 天赋与重阳再次进行了了沟通,确定了“单词挑战”与“背单词”这两个模块集成的难度,决定先不进行集成 ...

  5. stand up meeting 12-7

    weekend updates: 1.答题界面和结果界面的跳转和数据传输已全部完成. 2.答题界面完成简单的getRankingData API结果展示,答题时间,错误数目和错题题目的展示,点击题目可 ...

  6. M - Help Hanzo LightOJ - 1197 （大区间素数筛法）

    题解:素数区间问题.注意到a和b的范围是1<<31,所以直接暴力打表肯定不可以.如果一个数是合数,他的两个因子要么是两个sqrt(x),要么就分布在sqrt(x)两端,所以我们可以根据sq ...

  7. F 最大公约数和最小公倍数问题

    链接:https://ac.nowcoder.com/acm/contest/948/F来源:牛客网 输入2个正整数x0,y0(2<=x0<100000,2<=y0<=1000 ...

  8. F. 蚂蚁装修

    单点时限: 2.0 sec 内存限制: 512 MB 还有一个月就开学了,爱学习的小蚂蚁想庆祝一下!于是它要把它的“家”装修一下.首先要做的就是贴地板.小蚂蚁“家”的地面可以看成一个2∗N 的方格 , ...

  9. 2. Git-命令行-删除本地和远程分支

    命令行方式 Git Bash: 切换到要操作的项目文件夹 命令行 : $ cd <ProjectPath> 查看项目的分支们(包括本地和远程) 命令行 : $ git branch -a ...

  10. 感受python之美，python简单易懂的小例子

    前言 本文的文字及图片来源于网络,仅供学习.交流使用,不具有任何商业用途,版权归原作者所有,如有问题请及时联系我们以作处理. 1 简洁之美 通过一行代码,体会Python语言简洁之美 2 Python ...