随笔分类 -  CSS系列

怎么实现一个平行四边形
摘要:skewX函数定义了一个转换,该转换将元素倾斜到二维平面上的水平方向。它的结果是一个<transform-function>数据类型。子元素倾斜的角度值和父元素倾斜的角度值一样,但是方向不同,在程序中-和+表示方向,正方向时省略+符号。左平行与右平行通过改变父子元素的方向实现。 方法一:嵌套元素实现 阅读全文

posted @ 2024-09-05 16:35 大毛猫熊 阅读(50) 评论(0) 推荐(0)

什么是BFC
摘要:定义BFC (Block formatting context) 直译为 "块级格式化上下文"。它是一个独立的渲染区域,只有 Block-level box 参与,它规定了内部的 Block-level Box 如何布局,并且与这个区域外部毫不相干。 布局规则 1、内部的 Box 会在垂直方向,一个 阅读全文

posted @ 2024-09-05 15:43 大毛猫熊 阅读(81) 评论(0) 推荐(0)

rpx、px、vw、vh、em、rem、pt
摘要:单位 特点 用途 rpx 相对于屏幕宽度的响应式单位,自适应缩放 布局和字体大小 px 固定单位,不具备响应性 边框、阴影等固定尺寸元素 vw 相对于视窗宽度的百分比,响应式单位 响应式布局 vh 相对于视窗高度的百分比,响应式单位 响应式布局 em 相对于父元素的字体大小 字体大小 rem 相对于 阅读全文

posted @ 2024-08-31 12:35 大毛猫熊 阅读(34) 评论(0) 推荐(0)

CSS-选择器
摘要:选择器优先级 1、结构伪类选择器:可方便的选取一个或多个特定的元素 :first-child 选取属于其父元素的首个子元素:last-child 选取属于其父元素的最后一个子元素:nth-child(n) 选择第n个子元素 n=even / 2n :选取偶数孩子 n=odd / 2n+1 :选取奇数 阅读全文

posted @ 2021-05-31 17:02 大毛猫熊 阅读(21) 评论(0) 推荐(0)