Css media query when JavaScript disabled?

Question

Is it possible to use css @media query like this:

@media (javascript: disabled) { 
 body { color: red; } 
}

Or is there another way to do like this?

Do it the other way around. Add a class that JS is availbale. — thetailor.de
– thetailor.de, Commented Sep 13, 2021 at 8:16
Media Queries Level 5 has developer.mozilla.org/en-US/docs/Web/CSS/@media/scripting, but no browser support yet. — C3roe
– C3roe, Commented Sep 13, 2021 at 8:17
A bit of basic research brings lots of approaches however, stackoverflow.com/q/4665748/1427878, stackoverflow.com/q/32514426/1427878, stackoverflow.com/q/35382266/1427878, stackoverflow.com/q/6181340/1427878 — C3roe
– C3roe, Commented Sep 13, 2021 at 8:19
As of recently all (major) browsers support the @media scripting query — StackByMe
– StackByMe, Commented Feb 21, 2024 at 15:00

esqew · Accepted Answer · 2021-09-13 08:21:23Z

4

For the most valid markup possible, you should be able to include this rule as part of a <noscript> block:

<noscript>
    <style type="text/css">
        body {
            color: red;
        }
    </style>
</noscript>

answered Sep 13, 2021 at 8:19

esqew

44.9k28 gold badges139 silver badges179 bronze badges

Sign up to request clarification or add additional context in comments.

1 Answer 1