flex是flexible Box的缩写 意为:"弹性布局" 用来为盒状模型提供最大的灵活性 任何一个容器都可以指定为flex布局
当我们为父盒子设置为flex布局以后 子元素的float clear 和vertical-align属性将会失效
伸缩布局 = 弹性布局 = 伸缩盒布局 = 弹性盒布局 =flex布局
采用flex布局的元素 称为Flex容器 简称"容器" 它的所有子元素会自动成为容器内成员 称为flex项目 简称"项目"
总结: 就是通过给父盒子添加flex属性 来控制盒子的位置和排列方式
在flex布局中，是分为主轴和侧轴两个方向，同样的叫法有：行和列、x轴和y轴默认主轴方 向就是x轴方向，水平向右默认侧轴方向就是y轴方向，水平向下
flex-direction属性决定主轴的方向（即项目的排列方向）注意：主轴和侧轴是会变化的，就看flex-direction设置谁为主轴，剩下的就是侧轴。而我们的子元素是跟着主轴来排列的
属性值: row 默认从左到右
row-reverse 从右到左
column 从上到下
column-reverse 从下到上
属性值及说明:
flex-start 默认从头部开始 如果主轴是x轴 则从左到右
flex-end 从尾部开始排列
center 在主轴居中对齐(如果主轴是x轴 则水平居中)
space-around 平分剩余空间
space-between 先两边贴边 再平分剩余空间
默认情况下 项目都排在轴线上 flex-wra属性默认是不换行的 当子元素宽度排列大于父元素宽度时默认不换行,而是缩小每个子元素来达到适应父元素的宽度
属性及说明:
nowrap 默认 不换行
wrap: 换行
设置子项在侧轴上的排列方式并且只能用于子项出现换行的情况（多行），在单行下是没有效果的
属性及说明
flex-start : 默认 在侧轴的头部开始排列
flex-end : 在侧轴的尾部开始排列
center : 在侧轴中间显示
space-around : 子项在侧轴平分剩余空间
space-between : 子项在侧轴先平分(贴)在两头 再平分剩余空间
stretch : 拉伸 设置子项元素高度平分父元素高度 注意子元素不要设置高度
该属性是控制子项在侧轴（默认是y轴）上的排列方式在子项为单项（单行）的时候使用
属性及说明:
flex-start : 默认 从上到下
flex-end : 从下到上
center : 挤在一起居中 (垂直居中)
stretch : 拉伸 注意在使用时子元素不要设置高度
align-self 属性允许单个项目有与其他项目不一样的对齐方式，可覆盖align-items属性。默认值为auto，表示继承父元素的align-items属性，如果没有父元素，则等同于stretch
数值越小，排列越靠前，默认为0。注意：和z-index 不一样。
是否可以为特定(或所有)项目使用多个布局？例如，我有几个项目，我想对其应用两种不同的布局。一个是绿色的，一个是蓝色的(但是)。我想将它们编译到我的输出目录中的两个不同文件夹中(例如v1和v2)。我一直在玩弄规则和编译block，但我不知道这是怎么回事。因为，每个项目在编译过程中只编译一次，我不能告诉nanoc第一次用layout1编译，第二次用layout2编译。我试过这样的东西，但它导致输出文件损坏。compile'*'doifitem.binary?#don’tfilterbinaryitemselsefilter:erblayout'layout1'layout'layout2'
我想为网站的管理和公共(public)部分设置一对样式指南。每个都需要自己的布局，其中包含静态html和调用erbpartials的混合(因此静态页面不会削减它)。我不需要Controller来为这些页面提供服务，而且我不希望有效的仅开发内容使其余代码困惑。这让我想知道是否有一种方法可以直接呈现布局。免责声明:我明白这不是我应该经常/永远做的事情，而且我知道有很多争论可以解释为什么这是一个坏主意。我对这是否可能感兴趣。有没有办法让我直接从routes.rb渲染布局而不通过Controller？ 最佳答案 出于某种奇怪的原因，我想暂时
这个问题在这里已经有了答案:differentlayoutforsign_inactionindevise(8个答案)关闭7年前。如何更改设计Controller中的布局？
我有request.env['http_host']在本地主机上工作，但在heroku的布局页面中引用时会导致错误。此请求在View中工作并显示正确的基本url，但是当我将代码移动到布局时它会导致错误。注意-我正在使用它来为html电子邮件中的图像构建绝对url。收到错误:ActionView::Template::Error(undefinedmethod`env'fornil:NilClass): 最佳答案 如果你想要没有端口的主机，只需使用:request.host编辑:糟糕，我刚刚注意到您正在使用View中的代码。我不知道它
我对RubyGUI设计做了很多研究，这似乎是Ruby倾向于落后的领域。我探索了MonkeyBars、wxRuby、fxRuby、Shoes等选项，只是想从Ruby社区获得一些意见。虽然它们绝对可用，但每一个的开发似乎都在下降。我在任何(减去fxRuby书)上都找不到大量有用的文档或用户基础。我只是想制作一个简单的GUI，所以我真的不想花费数百小时来学习更复杂的工具的复杂性或尝试使用甚至不再开发的东西(鞋子是应用程序的类型我正在寻找，但它有很多问题并且没有得到积极开发。)在所有选项中，你们会推荐哪个选项是最快的，并且仍然具有某种开发基础？谢谢! 最佳答案
我正在覆盖设计注册Controller的创建操作。我有两种注册表格，个人或公司，公司有一个名为company_form的字段设置为true以区分这两种表格。在表单验证后，我希望呈现正确的表单(以前无论我使用什么表单，它都会返回默认表单)。我遇到了一个问题，即只渲染了部分(很明显，因为我只渲染了部分)，但我还需要渲染布局/应用程序文件。classRegistrationsControllerifresource.company_formrenderpartial:'shared/company_signup_form'elserenderpartial:'/shared/individu
我正在学习michaelharltrails教程，但出现此错误Missingtemplatelayouts/mailerwith{:locale=>[:en],:formats=>[:html],:variants=>[],:handlers=>[:raw,:erb,:html,:builder,:ruby,:coffee,:jbuilder]}.Searchedin:*"/home/ubuntu/workspace/app/views"预览账户激活时这是我的user_mailer.rbclassUserMailer错误突出显示了mailto:user.email,subject:"A
tl;dr:在Sinatra中是否有一种干净的嵌套布局方式？对于我网站上的所有页面，我有一个通用的layout.erb，它呈现页眉、页脚和其他一些位。对于这些页面的一个子集，我想使用内部布局，除了那些公共(public)位之外，它还呈现左侧菜单。全局erb:pageTemplate执行layout.erb，其中yield执行pageTemplate在子集中erb:pageTemplate执行layout.erb，其中yield执行specificLayout.erb，其中yield执行pageTemplate。有道理吗？我对单独的类、before语句和任何其他ruby魔法持开放态度
我需要消息在项目中有不同的布局，是否可以在Rails中做这样的事情？ClassMessages::New谢谢 最佳答案 这对你有帮助classMessagesController 关于ruby-on-rails-在Rails中是否可以动态加载类布局？，我们在StackOverflow上找到一个类似的问题： https://stackoverflow.com/questions/1274999/
我正在尝试在独立(非Rails)应用程序中做这样的事情:layout.slim:h1Hello.content=yield显示.slim:=object.name=object.description我不知道如何指定布局和模板。这对slim(或haml)有可能吗？谢谢。 最佳答案 layout.slim文件如下所示:h1Hello.content==yieldcontents.slim文件如下所示:=name这可以缩短，但为了便于解释，我将其分成了各个步骤。require'slim'#Simpleclasstorepresentan
