1. var() 函数
使用方法:
通过-- + 字段名:值(这个值可以是任何我们在css输入的值)进行定义类似的js的定义,调用时候通过var()函数进行对应的调用,如下面代码一样var(--字段名)进行调用。
body {
--size: 20px;
font-size: var(--size); // 20px
padding:var(--size); // 20px
}
该变量有作用域
,在body中定义好的值只能在body中使用,在其他类中将无法识别
。可以通过在:root
定义字段,这就相当于css中的全局变量,可以在css中任意的样式中进行使用。
:root{--size:20px;}
.test{ font-size: var(--size); } // 20px
.test2{ font-size: var(--size); } // 20px
2. pointer-events
指定在什么情况下 (如果有) 某个特定的图形元素可以成为鼠标事件的 target
/* Keyword values */
pointer-events: auto;
pointer-events: none;
pointer-events: visiblePainted; /* SVG only */
pointer-events: visibleFill; /* SVG only */
pointer-events: visibleStroke; /* SVG only */
pointer-events: visible; /* SVG only */
pointer-events: painted; /* SVG only */
pointer-events: fill; /* SVG only */
pointer-events: stroke; /* SVG only */
pointer-events: all; /* SVG only */
/* Global values */
pointer-events: inherit;
pointer-events: initial;
pointer-events: unset;