1、常见用法
语法:
@supports (property: value){
element {
property: value;
}
}
“@supports”中的“条件规则”可以声明一条或者几个由不同的逻辑运算符相结合的声明(比如说,非(not),或(or),与(and)等),而且还可以使用括号来确定其操作的优先级关系。
比如:Flex布局
.flex {
float: left;
}
@supports (display: flex){
.flex {
display: flex;
float: none;
}
}
上面的代码可以用来应对那些不支持Flex布局的浏览器。
2、非(not)逻辑声明
@supports not (property: value){
element {
property: value;
}
}
当使用not时,表示浏览器不支持某些属性时,对应的样式将会渲染。
3、与(and)逻辑声明
@supports (property: value) and (property: value) {
element {
property: value;
}
}
当使用and时,只有and两端条件同时成立,也就是同时返回true时,对应的样式才会渲染。
css等间隔,css鼠标 素材,div css 图片叠加,纯css实现鲁班logo,css media适配pad端,css按钮颜色怎么弄,网页引入css文件路径