前端——布局
前端布局知识
wybxzht
这个作者很懒,什么都没留下…
展开
-
Grid布局
基本概念 <div class="container"> <div class="item">1</div> <div class="item">2</div> <div class="item">3</div> <div class="item">4</div> <div class="item">5原创 2020-08-22 15:29:49 · 296 阅读 · 0 评论 -
flexbox示例2——网格/圣杯布局
网格布局:flex:1;将项目设为auto。flex:0 0 25%;将项目设为固定的大小容器的1/4;实现效果:html: <div class="box"> <div class="item"> <div></div> <div></div> <div></div> </div&g原创 2020-08-18 15:21:28 · 153 阅读 · 0 评论 -
flexbox示例1——骰子布局
基础样式css设置:<style> .box{ width: 900px; height: 900px; margin: 0 auto; background: silver; } .item{ width: 300px; height: 300px; background: b原创 2020-08-15 23:07:06 · 162 阅读 · 0 评论 -
flexbox语法
违法额外原创 2020-08-14 18:13:45 · 152 阅读 · 0 评论 -
圣杯布局
圣杯布局实现:浏览器页面宽度变化时,左右内容不变,中间内容自适应整体浮动,c在最前面,方便渲染左右宽度恒定center宽度width=100% = 父元素宽度,宽度自适应父元素设置min-width将左右移动到自己应该去的位置,定位/margin等方法实现 -->...原创 2020-08-13 15:14:19 · 145 阅读 · 0 评论