Команда supports

Командата @supports задава стил на елементи, като взема предвид възможностите, поддържани от браузъра. В тази команда могат да се създават условия с помощта на логически оператори not, and, or.

Синтаксис

@supports условие {
	
}

Пример

Нека зададем условие, че ако вашият браузър поддържа свойство display със стойност flex, ще се покаже само абзац с съответния текст, като цветът на шрифта му ще е син:

<p class="yes">Вашият браузър поддържа display: flex.</p>
<p class="no">Вашият браузър не поддържа display: flex.</p>

@supports (display: flex) {
	.no {
		display: none;
	}
	p {
		color: #467CBC;
	}
}
@supports not (display: flex) {
	.yes {
		display: none;
	}
}

Вижте също

команда @import,
която импортира CSS файл
команда @media,
която задава стил за тип носител
команда !important,
която задава приоритет на стила