怎样让一个元素在垂直或者水平方向居中显示，可以使用css解决，但是会出现不同浏览器的兼容性问题，而flex布局解决了一个父容器和多个子元素的布局问题，从而灵活布局。
代码展示
在父标签加入display:flex后
.wrap{
height:800px;
border:28px solid antiquewhite;
display:flex;
}
垂直布局变成水平布局，如下图所示
在父标签中修改
.wrap{
height:800px;
border:28px solid antiquewhite;
display:flex;
flex-direction:column;
}
后又变成垂直布局
先介绍下主轴和交叉轴概念，有些属性只针对主轴生效，部分对交叉轴生效
justify-content用来设置主轴方向上的子元素排列的方式，属性为center时意味居中显示
.wrap{
height:800px;
border:28px solid antiquewhite;
display:flex;
justify-content:center;
}
又变成水平居中显示：
更改justify-content属性值，justify-content：flex-start后，从起始侧开始排列：
justify-content：flex-end后，排列在尾部：
想均匀分割子元素的空间距离，可使用justify-content：space-between;
justify-content：space-around;
justify-content：space-evenly;
.wrap{
height:800px;
border:28px solid antiquewhite;
display:flex;
flex-direction:column;
justify-content:center;
}
注意，此时因为flex-direction:column变成了垂直展示，但是此时垂直方向（从上到下）为主轴，水平方向（自左向右）为交叉轴
修改后变成垂直方向居中显示：
align-items:center用来设置交叉轴方向上的子元素排列的方式，属性为center时意味居中显示
.wrap{
height:800px;
border:28px solid antiquewhite;
display:flex;
flex-direction:column;
justify-content:center;
align-items:center;
}
后使交叉轴方向居中显示：
当网页缩小到页面不足以容纳元素的排列，使盒子中的元素压缩，失去原来的形状，希望能换行展示，则使用
flex-wrap：wrap;
第二个盒子不设定宽度，则盒子宽度就为内容本身宽度
代码展示
此时修改代码：
.box-2{
background:darkcyan;
flex-grow:1;
}
大约一年前，我决定确保每个包含非唯一文本的Flash通知都将从模块中的方法中获取文本。我这样做的最初原因是为了避免一遍又一遍地输入相同的字符串。如果我想更改措辞，我可以在一个地方轻松完成，而且一遍又一遍地重复同一件事而出现拼写错误的可能性也会降低。我最终得到的是这样的:moduleMessagesdefformat_error_messages(errors)errors.map{|attribute,message|"Error:#{attribute.to_s.titleize}#{message}."}enddeferror_message_could_not_find(obje
是否可以为特定(或所有)项目使用多个布局？例如，我有几个项目，我想对其应用两种不同的布局。一个是绿色的，一个是蓝色的(但是)。我想将它们编译到我的输出目录中的两个不同文件夹中(例如v1和v2)。我一直在玩弄规则和编译block，但我不知道这是怎么回事。因为，每个项目在编译过程中只编译一次，我不能告诉nanoc第一次用layout1编译，第二次用layout2编译。我试过这样的东西，但它导致输出文件损坏。compile'*'doifitem.binary?#don’tfilterbinaryitemselsefilter:erblayout'layout1'layout'layout2'
1.upto(9){|x|printx}为什么这行不通？{printx|x}}y呢？ 最佳答案 它用于传递给您的block的参数。即在您的示例中，upto将使用1到9中的每个数字调用您的block，当前值可作为x获得。block参数可以有任何名称，就像方法参数一样。例如1.upto(9){|num|putsnum是有效的。就像一个方法的参数一样，一个block也可以有多个参数。例如hash.each_pair{|key,value|puts"#{key}is#{value}"} 关于ru
我需要在rail3中使用标准注册/登录/忘记密码功能进行身份验证。是否有大多数人为此使用的插件或其他东西？ 最佳答案 我不确定最常用的方法是什么-但可以肯定的是，Plataformatec的“Devise”是一个非常流行的方法:http://github.com/plataformatec/devise我已经尝试了一些authgem，对我来说，它是最简单的设置和修改以满足我的需要。它内置了密码恢复、帐户确认(如果需要)和其他一些非常方便的功能。 关于ruby-on-rails-在Rail
我在ruby表单中有一个提交按钮f.submitbtn_text,class:"btnbtn-onemgt12mgb12",id:"btn_id"我想在不使用任何javascript的情况下通过ruby禁用此按钮 最佳答案 添加disabled:true选项。f.submitbtn_text,class:"btnbtn-onemgt12mgb12",id:"btn_id",disabled:true 关于ruby-on-rails-如何在Rails中添加禁用的提交按钮，我们在St
关闭。这个问题是off-topic.它目前不接受答案。想改进这个问题吗？Updatethequestion所以它是on-topic用于堆栈溢出。关闭11年前。Improvethisquestion我不经常使用ruby-通常它加起来相当于每两个月或更长时间编写一次脚本。我的大部分编程都是使用C++进行的，这与ruby有很大不同。由于我与ruby之间的差距如此之大，我总是忘记语言的基本方面(比如解析文本文件和其他简单的东西)。我想每天练习一些基本的东西，我想知道是否有一些我可以订阅的网站，并且会向我发送当天的Ruby问题或类似的东西。有人知道这样的站点/Internet服务吗？
电脑上可以截取图片吗？如果可以，该如何操作呢？相信很多小伙伴都只知道一两种截图的方式，知道的并不全面。其实，电脑上有多种方式截图的，而且非常方便。电脑怎么截图？今天我们就来教大家如何使用电脑截取图片的8种常用方式！操作环境：演示机型：Delloptiplex7050系统版本：Windows10方法一：系统自带截图具体操作：同时按下电脑的自带截图键【Windows+shift+S】，可以选择其中一种方式来截取图片：截屏有矩形截屏、任意形状截屏、窗口截屏和全屏截图。 方法二：QQ截图具体操作：在电脑登录QQ，然后同时按下【Ctrl+Alt+A】，可以任意截图你需要的界面，可以把截图的页面直接下载，
1.Scenes游戏场景文件夹用于放置unity的场景文件 2.Plugins插件文件夹用于放置unity的依赖文件，例如dll 3.Scripts脚本文件夹用于放置unity的c#脚本文件 4.Resources游戏资源文件夹用于放置unity的各种游戏资源，比如images,prefabs,同时只有放到Resources文件夹的游戏资源才能使用Resource.load(资源路径不加后缀)加载到游戏内存中进行使用 5.EditorUnity编辑器扩展脚本文件夹usingUnityEditor;这个名称空间就是Unity编辑器的名称空间这个名称空间提供了扩展Unity编辑器的各种类 【你所有
我想为网站的管理和公共(public)部分设置一对样式指南。每个都需要自己的布局，其中包含静态html和调用erbpartials的混合(因此静态页面不会削减它)。我不需要Controller来为这些页面提供服务，而且我不希望有效的仅开发内容使其余代码困惑。这让我想知道是否有一种方法可以直接呈现布局。免责声明:我明白这不是我应该经常/永远做的事情，而且我知道有很多争论可以解释为什么这是一个坏主意。我对这是否可能感兴趣。有没有办法让我直接从routes.rb渲染布局而不通过Controller？ 最佳答案 出于某种奇怪的原因，我想暂时
谁能告诉我如何在ruby中获取可用磁盘驱动器的列表？我正在创建一个打开的文件对话并且需要知道!提前致谢，嗯。 最佳答案 Brian给出的文章正确地陈述了以下代码:require'win32ole'file_system=WIN32OLE.new("Scripting.FileSystemObject")drives=file_system.Drivesdrives.eachdo|drive|puts"Availablespace:#{drive.AvailableSpace}"puts"Driveletter:#{drive.D