博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
flex布局-css
阅读量:4608 次
发布时间:2019-06-09

本文共 503 字,大约阅读时间需要 1 分钟。

1.html

<div id="parent">

   <div id="child1"></div>

   <div id="child2"></div>

   <div id="child3"></div>

</div>

2.css-----父级postion不能是absolute!!

1)child1 固定宽度,child2因child3的宽度变化而变化

#parent{display:flex;width:100%;}

#child1{width:35px;}

#child2{flex:1;-webkit-flex:1;}

#child3{不设宽度}

2)child1、child2及child3宽度按照比例显示 1:2:1

#parent{display:flex;width:100%;}

#child1{flex:1;-webkit-flex:1;}

#child2{flex:2;-webkit-flex:2;}

#child3{flex:1;-webkit-flex:1;}

 

转载于:https://www.cnblogs.com/luoyishamai/p/6517886.html

你可能感兴趣的文章
navicat 导出查询结果
查看>>
安卓突击:service的基础知识
查看>>
在Visual Studio中使用Debug Visualizers在C++中实现对原始类的自定义调试信息显示
查看>>
Swift简介
查看>>
Finally, which light is on?
查看>>
FFT-初识篇
查看>>
改变dijit的长度的心得
查看>>
国产手机插入mac os 系统中无法被识别的解决方法
查看>>
Python集合模块collections
查看>>
mobile开发技巧(转)
查看>>
POJ-1180 Batch Scheduling (分组求最优值+斜率优化)
查看>>
5.1.2
查看>>
3.24
查看>>
一个文件夹可以link 到另外一个文件夹
查看>>
servlet 项目 ,,启动没问题,,但是,一请求也面就报错误。。。。求解决。。。。。。。。。。。。。各种百度,都没解决了啊。。。。。急急急急急急急急急急急急急急急急急急...
查看>>
卖空大师”:中国经济构造畸形 坚决卖空中国
查看>>
移动端与PC端的触屏事件
查看>>
#include stdio.h(6)
查看>>
#include stdio.h(1)
查看>>
JQuery点击打开再点击关闭
查看>>