条件判断语句我们在js,php中是常见了,但在以前的css中比较少见,现在使用css3发现有一个 @supports条件判断命令了,下文来给大家介绍它如何使用吧。
用JavaScript在客户端检测浏览器是否支持某项功能特征,目前虽然这是最可行的方法,但不好的是,对于同一个特征的检测,我们需要反复多次用相同的函数附带各种浏览器前缀。而且因为CSS没有相应的功能,使用JavaScript会导致页面闪现,多余辅助代码等问题。火狐浏览器,谷歌浏览器和Opera浏览器最近刚刚添加了一项新的功能——在CSS里支持@supports标记、在JavaScript里支持CSS.supports函数,用来检测浏览器是否支持某个期望的样式功能。下面让我们来看看是如何使用的!
CSS @supports
CSS @supports标记在CSS代码里跟@media查询语句的语法相似:
代码如下 | 复制代码 | ||||||||||||||||||||||||||||||||
@supports(prop:value) { /* 各种样式 */ } CSS @supports允许程序员用多种不同的方法来探测当前浏览器是否支持某项CSS样式特征。 基本属性检测 你可以执行对基本属性和属性值的检测:
|