Css
文章平均质量分 70
一些关于Css小技巧
Z^x
这个作者很懒,什么都没留下…
展开
-
client&offset&scroll
今天复习的时候看到了图片懒加载这个技术,最简单的方法就是判断用户可视窗口的距离和要懒加载的图片的距离,借此进行判断是否要更改src中真正的请求路径;这种通过js实现懒加载的方式需要对可视窗口的距离进行判断,所以此文记录下client&offset&scroll这三个属性的区别和用法;原创 2023-05-11 08:29:28 · 55 阅读 · 0 评论 -
flex学习
复习到bootstrap的时候,我明显感觉到了栅格化开发的遍历之处,可以直接通过行&列的并行操作来进行样式布局,用起来非常有感觉,很便捷,但是要写很多很多类名,看起来不是很优雅,所以我开始研究另一种布局方式,弹性盒布局(flex)原创 2023-04-09 14:04:40 · 38 阅读 · 0 评论 -
z-index的理解
1、首先先看要比较的两个元素是否处于同一个层叠上下文中:1.1如果是,谁的层叠等级大,谁在上面(怎么判断层叠等级大小呢?——看“层叠顺序”图)。1.2如果两个元素不在统一层叠上下文中,请先比较他们所处的层叠上下文的层叠等级。2、当两个元素层叠等级相同、层叠顺序相同时,在DOM结构中后面的元素层叠等级在前面元素之上。原创 2023-04-10 21:00:00 · 44 阅读 · 0 评论 -
CSS实现多列等高
元素设置的padding-bottom尽可能大一些,并且需要设置一样大小的margin-bottom负值去抵消padding-bottom撑大的区域,正负一抵消,对于页面布局不会有影响。另外的话还需要设置父元素overflow:hidden把子元素多出来的色块背景隐藏掉。flex中的伸缩项目默认为拉伸为父元素的高度,同样可以实现等高效果。在pc端兼容性不是很好,在ie9以及ie9以下不支持。grid布局的缺点和flex一样,pc端兼容性不是很好,ie9以及ie9以下不支持。原创 2023-04-24 13:00:05 · 175 阅读 · 0 评论