CSS
xumaozeng
学习boying
展开
-
2021-03-26 CSS样式之Flex实战
2021-03-26 CSS样式之Flex实战 问题描述:如下图,案件类型是根据业务范围选择而变化的,所以案件类型这行的宽度是会动态变化的,既要保证不能超出,又要使更多文字不能与证券与资本市场这一类最后一行的按钮重合;并且点击更多会显示剩余的选项 解决方法:利用flex布局,全部与中间选项以及更多分为三个部分,统一放在一个div里面,布局为dispaly:flex 然后中间按钮布局如下:内部使用flex布局,而且使得超出换行flex-wrap:wrap .el-checkbox-group { dis原创 2021-03-26 12:26:13 · 142 阅读 · 0 评论 -
2020-11-03 css面试题集合
2020-11-01 css面试题集合原创 2020-11-03 13:54:45 · 124 阅读 · 0 评论 -
2020-03-12 CSS-grid之网格布局
2020-03-12 CSS-grid之网格布局grid布局简介布局属性 grid布局简介 CSS Grid布局是一个二维的布局系统 CSS Grid 相比传统布局在页面整体划分布局上更加出色 CSS Grid 并不是只能单独使用,依然可以搭配Flexbox以及传统定位布局一起使用 布局属性 给容器元素添加display:grid或display:inline-grid即创建了网格容器(Gr...原创 2020-03-12 14:19:58 · 155 阅读 · 0 评论 -
2019-11-15 CSS-flex弹性布局
2019-11-15 CSS-flex弹性布局flex布局简介父元素属性子元素上属性补充 简介:本文章结合项目经历来介绍下flex弹性布局的使用 flex布局简介 Flex是Flexible Box的缩写,简称“弹性布局”,用来为盒装模型提供最大的灵活性。采用Flex布局的元素,简称容器,它的所有子元素自动成为容器成员,简称项目。 父元素属性 display:flex;定义了一个flex容器 ...原创 2019-11-15 13:26:14 · 300 阅读 · 0 评论 -
2019-08-06 CSS-css垂直居中的几种方式
2019-08-06 css垂直居中的几种方式第一种,`position` + `margin`,块级元素定宽高第二种,`position` + `transform`,不定高宽度第三种,`flex`弹性布局 第一种,position + margin,块级元素定宽高 // html <div class="father"> <div class="son"> 垂直居...原创 2019-08-06 15:20:59 · 309 阅读 · 0 评论