如果浏览器支持CSS3媒体查询和CSS3渐变,我如何通过JavaScript检测？

if (CSS.supports('@media', '(min-width: 1px)') && CSS.supports('background-image', 'linear-gradient(red, red)')) {
  console.log('浏览器支持CSS3媒体查询和CSS3渐变');
} else {
  console.log('浏览器不支持CSS3媒体查询和CSS3渐变');
}

var div = document.createElement('div');
div.style.cssText = '@media (min-width: 1px) {background-image: linear-gradient(red, red);}';
document.body.appendChild(div);

var style = window.getComputedStyle(div);
if (style.backgroundImage === 'linear-gradient(red, red)') {
  console.log('浏览器支持CSS3媒体查询和CSS3渐变');
} else {
  console.log('浏览器不支持CSS3媒体查询和CSS3渐变');
}

if (Modernizr.cssgradients && Modernizr.mediaqueries) {
  console.log('浏览器支持CSS3媒体查询和CSS3渐变');
} else {
  console.log('浏览器不支持CSS3媒体查询和CSS3渐变');
}