css 鼠标穿透事件:pointer-events 发现个有意思的css属性:==pointer-events==语法: pointer-events: none 或者 auto; 特性: 阻止用户的点击动作产生任何效果 阻止缺省鼠标指针的显示 阻止CSS里的 hover 和 active 状态的变化触发事件 阻止JavaScript点击动作触发的事件 示例: 12345678910111213141 css #css
纯css 鼠标经过时的高级效果,丝滑的感觉:伪类的使用 案例1 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364<!DOCTYPE html><html><head> <meta charset="UTF-8 css #css
css 类似优惠券邮票那样的内抠圆角样式,内凹圆角处理 1.优惠券如图这样: 实现: 12345678910111213141516171819202122232425262728<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>js</title> css #css
CSS flex弹性布局 设置为弹性布局: display: flex; 搭配以下属性和值,实现完美布局 ==flex-direction==:决定主轴的方向 取值: row:横排,从左到右。 默认 row-reverse:横排,从右到左。 column:竖排,从上到下。 column-reverse:竖排。从下到上。示例: 1flex-direction: row; css #css
css transform属性详解 transform的值: rotate() 旋转 1transform:rotate(30deg): translate() 位移 1transform:translate(100px,20px): scale() 缩放 1transform:scale(2,1.5): skew() 扭曲 1transform:skew(30deg,10deg): css #css
css 可以计算的属性值:calc()函数 calc() 函数使我们可以在属性值中执行 加、减、乘、除 等数学计算的操作。 示例: 123.div{ width: 16.666666667%; } ==就可以写成:== 123.div{ width: calc(100% / 6);} 1. 语法:calc(除数 运算符 被除数) ,三个参数间一定要 css #css
css 声明变量和调用变量 语法: 以 -- 开头定义变量名 用 var() 调用变量值 1. 全局变量:示例图: 效果图: 2. 局部变量: js操作变量: https://blog.csdn.net/qq_42618566/article/details/108127106 css #css
css grid网格布局 display: grid; 搭配以下属性,实现完美布局: ==grid-template-columns== 设置列 ==grid-template-rows== 设置行 ==column-gap== 设置列间距 ==row-gap& css #css
css 输入框的光标颜色 使用 :placeholder-shown 伪类: 123:placeholder-shown { color: red;} 使用caret-color属性: css #css