随笔分类 -  web前端—CSS

css相关总结
基于FlexBox的无约束自适应
摘要：全手打原创，转载请标明出处： "https://www.cnblogs.com/dreamsqin/p/11972664.html" ，多谢，=。=~ 一、背景描述   对于通用型带过滤条件的列表查询项目中，列举下面两种常见功能需求，要满足内容高度、宽度自适应： 1、上中下布局， 阅读全文
posted @ 2019-12-02 19:01 Dreamsqin 阅读(683) 评论(0) 推荐(0) 编辑
css伪类:before及:after除了插入文字内容还能做点儿啥？画图
摘要：全手打原创，转载请标明出处：https://www.cnblogs.com/dreamsqin/p/11181416.html 1、什么时候用伪类:before和:after？ 结合实际开发情况，说一点自己的理解~ （1）原本这两个伪类核心是content，用于在指定元素之前或之后插入内容，但实际开 阅读全文
posted @ 2019-07-13 17:23 Dreamsqin 阅读(8637) 评论(0) 推荐(0) 编辑
根据可视窗口判断面板向上还是向下展开
摘要：本demo以element-ui框架为视图模板~ HTML代码 JS代码 CSS代码 阅读全文
posted @ 2019-05-18 13:44 Dreamsqin 阅读(405) 评论(0) 推荐(0) 编辑
Flexbox与Grid属性比较
摘要：网格容器（container）属性 网格项目（item）属性 Flex容器（container）属性 Flex项目（item）属性 flex-grow：定义项目的放大比例，默认为0，即如果存在剩余空间，也不放大； flex-shrink：定义了项目的缩小比例，默认为1，即如果空间不足，该项目将缩小； 阅读全文
posted @ 2019-05-17 19:35 Dreamsqin 阅读(565) 评论(0) 推荐(0) 编辑
div高度不能自适应（子级使用float浮动，父级div高度不能自适应）
摘要：1、问题截图： 2、问题描述： 由于地址、公司名长度的不定性，所以每一条地址所在的父级div高度不定，但是需要设置一个最小的高度min-height：48px;但是当内容增加的时候，父级div高度却不能自适应 3、HTML代码： 4、CSS代码： 5、解决办法： 在父级标签div闭合之前，即父级的< 阅读全文
posted @ 2017-07-11 17:05 Dreamsqin 阅读(807) 评论(0) 推荐(0) 编辑
两个div并列居中显示——当display:inline-block;时，两个div无法对齐即一高一矮
摘要：解决办法： 给div添加样式vertical-align: top; 阅读全文
posted @ 2017-06-15 22:08 Dreamsqin 阅读(2644) 评论(0) 推荐(0) 编辑
两个div并列居中显示——当display:inline;时，div的宽高不起作用即两个div重叠显示
摘要：解决办法： 将display设置为：inline-block 阅读全文
posted @ 2017-06-15 22:06 Dreamsqin 阅读(1345) 评论(0) 推荐(0) 编辑
WEB网页如何让背景图片跟随可视窗口自适应大小
摘要：HTML代码 CSS代码 JS代码 阅读全文
posted @ 2017-06-15 21:29 Dreamsqin 阅读(18437) 评论(0) 推荐(0) 编辑