王新阳

wangxinyang

css中定义变量

定义变量可分多种情况:
1、定义全局变量
:root {
  --borderColor: #ccc;
}

2、定义某元素下的变量
.look{
  --borderColor: #ccc;
}

3、定义媒体查询下的变量
@media screen and (min-width: 1025px) { 
    :root { 
        --borderColor: #ccc;
   }
}
使用:
.has-border-table > tr > td {
  border-right: 1px solid var(--borderColor);
}

less中定义变量
定义:
@bg-color : #d9d9d9;
使用:
.has-border-table > tr > td {
  border-right: 1px solid var(@bg-color);
}

sass中定义变量
定义:
$bg-color : #d9d9d9;
使用:
.has-border-table > tr > td {
  border-right: 1px solid var($bg-color);
}
2021-03-03
2024-05-01 星期三 农历三月二十三