CODEWITHSUNDEEP
css
LLLL_easycomeeasygo
LLLL_easycomeeasygo

Reputation: 63

CSS @Import media query fallback

Is there a way to import a css file if the rule is met otherwise use another so that in anycase one of the two files will be used and only one of them.

Somthing like:

@import "dark.css" screen and (prefers-color-scheme: dark); else @import "default.css";

Currently I'm doing this with with JavaScript, just curious if there is a pure css way

Upvotes: 0

Views: 360

Answers (2)

Asfo
Asfo

Reputation: 413

CSS DOESN'T has conditionals. So you can't do that "else".

But you can do an import for the default and then, override the CSS values by importing dark.css

@import "default.css" screen;
@import "dark.css" screen and (prefers-color-scheme: dark);

Upvotes: 0

Filip Huhta
Filip Huhta

Reputation: 2388

There is no if/else in pure CSS. You must use the javascript function to do this. Alternative there are CSS preprocessors like Sass, you can use. You can read more about it here: Sass conditonals.

Upvotes: 0

Related Questions