可以实现水平等分切割等。日后在研究，做个记录。

首先要声明：display:box，像谷歌浏览器要加前缀识别码：display:-webkit-box;

然后才开始使用其属性，同时也是要带上前缀识别码。

参考：

flex:

http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html

http://www.ruanyifeng.com/blog/2015/07/flex-examples.html

box:

http://www.warting.com/web/201402/68557.html

CSS3盒模型display初探（display:box/display:flex）的更多相关文章

  1. CSS3盒模型display:box详解

    display:box;box-flex是css3新添加的盒子模型属性,它的出现可以解决我们通过N多结构.css实现的布局方式.经典的一个布局应用就是布局的垂直等高.水平均分.按比例划分. 目前box ...

  2. CSS3盒模型温故

    CSS有一种基础设计模式叫盒模型,定义了Web页面中的元素是如何看做盒子来解析的.每一个盒子有不同的展示界面,下面就来介绍盒模型,主要有一下几种盒模型:inline.inline-block.bloc ...

  3. css3 盒模型记

    css3 盒模型 css假定每个元素都会生成一个或多个矩形框,这称为元素框.各元素框中心有一个内容区.这个内容区周围有可选的内边距,边框和外边距.这些项之所以被认为是可选的,原因是它们的宽度可以设置为 ...

  4. css3 盒模型

    0,前言 在css2.1 之前,我们都熟知的两种盒模型,一种是w3c标准盒模型,另外一种是怪异模式下的盒模型.在css3之前我们一直使用的是标准盒模型,但是标准盒模型的宽度总是需要小心的去使用,稍有不 ...

  5. 第94天：CSS3 盒模型详解

    CSS3盒模型详解 盒模型设定为border-box时 width = border + padding + content 盒模型设定为content-box时 width = content所谓定 ...

  6. 5.css3盒模型--margin/border/padding/content

    1.css3盒模型: ①margin外边距: Margin-top,Margin-right,Margin-bottom,Margin-left ②Border边框: Border-width Bor ...

  7. CSS3盒模型display:box;box-flex:3;

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name ...

  8. CSS3盒模型之box-sizing

    这些天在做一个手机端的页面,遇到了一些问题!首当其冲的就是盒子的溢出问题!大家都知道,手机的尺寸各异,各种型号的手机多得能闪瞎你们的眼睛,为了能 让这些设置更好的浏览我们的页面,我们已经不能固定页面的 ...

  9. CSS3盒模型——box-sizing

    box-sizing盒模型是CSS3的一个重要属性之一,常常被很多人给忽略了!CSS3出现之前box-sizing盒模型默认的宽高是指内容的宽高,css3之后可以用box-sizing来指定宽高. 目 ...

  10. CSS3 盒模型---css初始化会用到：box-sizing: border-box 盒子大小为 width 就是说 padding 和 border 是包含到width里面的

    CSS3中可以通过box-sizing 来指定盒模型,即可指定为content-box.border-box,这样我们计算盒子大小的方式就发生了改变. 可以分成两种情况: 1.box-sizing: ...

随机推荐

  1. 产品经理技能之MRD的笔记之一

    原文:http://www.woshipm.com/pmd/131946.html/comment-page-1 产品经理技能之MRD 一.MRD与BRD的不同之处 BRD:这么做有什么好处,并说明好 ...

  2. 解决ssh-connect-to-host-github-com-port-22-connection-timed-out

    PC:~$ ssh git@github.com ssh: connect to host github.com port 22: Connection timed out 解决办法:(linux下) ...

  3. oracle: job使用

    oracle的job,实际上就是数据库内置的定时任务,类似代码中的Timer功能.下面是使用过程: 这里我们模拟一个场景:定时调用存储过程P_TEST_JOB 向表TEST_JOB_LOG中插入数据 ...

  4. 基于ASP.NET MVC的热插拔模块式开发框架(OrchardNoCMS)--AOP编程

    AOP编程在目前来说好像是大家都比较喜欢的.ASP.NET MVC中的Filter就是使用AOP实现的配置器模式.AOP在编码中的应用主要有如下几个方面: 日志记录,跟踪,优化和监控 事务的处理 持久 ...

  5. 创建pathing jar

    pathing jar是一个特殊的jar: 该jar文件只包含manifest.mf文件 该manifest文件只包含Class-Path,列出了所有需要真正加到classpath中的jar,或者di ...

  6. 一起写一个JSON解析器

    [本篇博文会介绍JSON解析的原理与实现,并一步一步写出来一个简单但实用的JSON解析器,项目地址:SimpleJSON.希望通过这篇博文,能让我们以后与JSON打交道时更加得心应手.由于个人水平有限 ...

  7. Linux下 RabbitMQ的安装与配置-3

    一  Erlang安装 1.RabbitMQ是基于Erlang的,所以首先必须配置Erlang环境. 从Erlang的官网http://www.erlang.org/download.html 下载最 ...

  8. ModernUI教程：主题资源引用

    已经完成的主题资源列表 提示:请关注Modern UI的开发工作,资源文件可能在演进版本中新增和删除. 资源列表可以去访问原文,原文可复制,该表未改动原文. 查看目录

  9. factor graph model

    主实验 文慧:用户,商品,评分,review,ranking. 数据集:数据规模,论文源代码

  10. gettter，delatter，settter

    class Foo: x = 1 def __init__(self,y): self.y=y def __getattr__(self, item): print('自行--getatter') d ...