div实际得宽度=div宽度+padding的宽度。想保持一定距离有很多方法:你可以把让现在div的宽度改成减去padding后的宽度,还可以里面欠个div直接设padding。
任何一个容器都可以指定为Flex布局。行内元素也可以使用Flex布局。Webkit内核的浏览器,必须加上-webkit-前缀。
注意,设为Flex布局以后,子元素的float、clear和vertical-align属性将失效。
div实际得宽度=div宽度+padding的宽度
想保持一定距离有很多方法:
你可以把让现在div的宽度改成减去padding后的宽度,
还可以里面欠个div直接设padding
<div?class='father'>
????<div?class='child-one'>测试1</div>
????<div?class='child-two'>测试2</div>
????<div?class='child-three'>测试3</div>
</div>.father?{
????display:?flex;
}
/*比如要设置‘测试1’所在‘div’宽度固定为‘300px’*/
.child-two?{
????flex-grow:?0;
????flex-shrink:?0;
????width:?300px
}
/*可以理解为:此处设置flex-grow,flex-shrink是告诉flex,既不要给我自动放大,也不要给我自动缩小,我就想设置自己的宽度*/
父元素高度设置为空或者auto即可,如height:auto或者不要height;,举例如下: 1.高度采用auto; 这里是子集内容,子集内容采用的是宽度780px,高度1000px,并且居中对齐; 这是父级内容,宽度为800px,高度自适应
如果是flex-direction: row;则对相应的flex-item设置样式为 flex:0 1 200px就是设置宽度为200px;flex-direction方向的则是设置高度为200px,也可以用%单位;
注意,设为Flex布局以后,子元素的float、clear和vertical-align属性将失效。
但是子元素的宽高,还可以设置啊,使用 width,height,就好了。
Photoshop|
Dreamweaver|
SVG|
WebGL|
Visual Studio|
PowerDesigner|
Eclipse|
Git|
Apache Ant|
Atom|
Composer|
CodeSmith|
Flex|
Gradle|
Maven|
Sublime Text3|
SVN|
Tableau|
Vim|
Chrome开发者工具|
OpenGL|
Unity|
Direct3D|
用户登录
还没有账号?立即注册
用户注册
投稿取消
文章分类: |
|
还能输入300字
上传中....