xumaozeng的博客

2021-03-26 CSS样式之Flex实战问题描述：如下图，案件类型是根据业务范围选择而变化的，所以案件类型这行的宽度是会动态变化的，既要保证不能超出，又要使更多文字不能与证券与资本市场这一类最后一行的按钮重合；并且点击更多会显示剩余的选项解决方法：利用flex布局，全部与中间选项以及更多分为三个部分，统一放在一个div里面，布局为dispaly:flex然后中间按钮布局如下：内部使用flex布局，而且使得超出换行flex-wrap:wrap.el-checkbox-group { dis

2020-11-01 css面试题集合

2020-03-12 CSS-grid之网格布局grid布局简介布局属性grid布局简介CSS Grid布局是一个二维的布局系统CSS Grid 相比传统布局在页面整体划分布局上更加出色CSS Grid 并不是只能单独使用，依然可以搭配Flexbox以及传统定位布局一起使用布局属性给容器元素添加display:grid或display:inline-grid即创建了网格容器(Gr...

2019-11-15 CSS-flex弹性布局flex布局简介父元素属性子元素上属性补充简介：本文章结合项目经历来介绍下flex弹性布局的使用flex布局简介Flex是Flexible Box的缩写，简称“弹性布局”，用来为盒装模型提供最大的灵活性。采用Flex布局的元素，简称容器，它的所有子元素自动成为容器成员，简称项目。父元素属性display:flex;定义了一个flex容器...

2019-08-06 css垂直居中的几种方式第一种，`position` + `margin`，块级元素定宽高第二种，`position` + `transform`，不定高宽度第三种，`flex`弹性布局第一种，position + margin，块级元素定宽高// html<div class="father"> <div class="son"> 垂直居...