2021年3月10日
C3新增-transition过渡
摘要： transition:过渡的属性 过渡的持续时间 过渡的速度变化类型 过渡的延迟时间; 阅读全文
posted @ 2021-03-10 22:02 紫豹豹 阅读(80) 评论(0) 推荐(0)
C3新增-transform转换
摘要： transform-转换 1)作用： 使元素在位置或者形状上发生一定的改变 2)属性： transform: translate() /rotate() /scale() /skew(); 3)属性值 ①位移 单位：px、% transform: translate(x,y); 当只取一个值,表示水 阅读全文
posted @ 2021-03-10 21:44 紫豹豹 阅读(263) 评论(0) 推荐(0)
C3新增-背景渐变
摘要： 背景渐变 1)属性 background-image: ; 简写: background: ; 2)属性值 ①线性渐变 background-image: linear-gradient(方向,颜色1,颜色2,..); 注意: 方向可以省略,默认从上往下渐变，最少两个颜色值 取值: a、关键词to 阅读全文
posted @ 2021-03-10 16:43 紫豹豹 阅读(205) 评论(0) 推荐(0)
2021年3月9日
z-index堆叠顺序
摘要： 堆叠顺序： z-index:number ; 默认值auto，可以取负值 取值越大,层级越往上 必须配合定位使用(static除外) 阅读全文
posted @ 2021-03-09 23:06 紫豹豹 阅读(71) 评论(0) 推荐(0)
BFC ：块级格式化上下文
摘要： BFC ( Block formatting context )直译为“块级格式化上下文”。 他是一个独立渲染的区域，它规定了内部如何布局,容器里面的子元素不会在布局上影响到外面的元素。 如何产生BFC ? 1、float取值left或者right； 2、Position 取值为absolute或者 阅读全文
posted @ 2021-03-09 22:47 紫豹豹 阅读(57) 评论(0) 推荐(0)
清除浮动的影响
摘要： 清除浮动的影响: ①给浮动元素的父元素设置高度 (需要高度是已知的) ②给浮动元素的父元素加 overflow:hidden/auto; （常用）(开启BFC格式:变为独立的一块, 子元素不会在布局上影响父元素) ③给受影响的元素加 clear:left/right/both; ④空div法 (弊端 阅读全文
posted @ 2021-03-09 22:42 紫豹豹 阅读(155) 评论(0) 推荐(0)
厂商前缀
摘要： 厂商前缀是用于浏览器对C3新特性的支持 浏览器 厂商前缀 内核 | 谷歌 | -webkit- | blink | | 苹果 | -webkit- | webkit | | 火狐 | -moz- | gecko | | 欧朋 | -o- | blink | | I E | -ms- | triden 阅读全文
posted @ 2021-03-09 22:15 紫豹豹 阅读(122) 评论(0) 推荐(0)
盒模型转换
摘要： box-sizing: content-box; 为默认值，标准盒模型 box-sizing: border-box; 怪异盒模型 阅读全文
posted @ 2021-03-09 21:59 紫豹豹 阅读(71) 评论(0) 推荐(0)
弹性盒模型flexbox
摘要： 弹性盒模型用到的一些属性 1、写在父元素上的属性 1)开启弹性布局（元素默认水平排列） display:flex; 2)设置子元素的排列方式(即弹性盒的方向) flex-direction: ; row 默认值，子元素从左往右排列 row-reverse 子元素从右往左排列 column 子元素从上 阅读全文
posted @ 2021-03-09 21:57 紫豹豹 阅读(76) 评论(0) 推荐(0)
2021年3月8日
属性选择器
摘要： 属性选择器：就是利用HTML的属性选中有此属性的所有元素 书写格式： ①[属性=属性值] ②元素[属性=属性值] ③元素[属性^=值] 以当前值开头 ④元素[属性$=值] 以当前值结尾 ⑤元素[属性*=值] 包含当前值 阅读全文
posted @ 2021-03-08 16:57 紫豹豹 阅读(184) 评论(0) 推荐(0)