随笔分类 -  flex布局

flex box 布局学习
摘要:用flex布局达到以下效果,注意时两种6点的显示哦 阅读全文
posted @ 2017-01-01 22:58 新手学习中 阅读(2219) 评论(0) 推荐(0)
摘要:几个重要的概念 主轴、主轴开始点、主轴结束点、 交叉轴 容器(display:flex的元素上)属性 flex-direction 表明主轴方向 可选值 默认为row 就时横向从左到右显示 row-reverse就是横向靠右显示 column就时纵向从上到下显示 column-reverse 就是纵 阅读全文
posted @ 2017-01-01 22:54 新手学习中 阅读(367) 评论(0) 推荐(0)
摘要:flex布局解决了几个问题 1 margin重叠问题 例如 正常来说:class为item 的第一个div和第二个div上下之间应该有60px的具体,但是只有30px 2 使用flex,清除了float 阅读全文
posted @ 2017-01-01 22:20 新手学习中 阅读(186) 评论(0) 推荐(0)
摘要:1 可以轻松实现 在div中 水平垂直 方向上的居中 2可以动态的自适应屏幕高宽的响应式显示布局 3现在技术成熟了,使用比较灵活,兼容性也很好了 IE8和以下不支持 4做移动端网页比较好用 知识点 display: flex; margin:auto 其他的都时修饰 第一个案例 居中显示 <!DOC 阅读全文
posted @ 2017-01-01 22:10 新手学习中 阅读(244) 评论(0) 推荐(0)