I wanted to make my website display something if they don't use JavaScript. I know you could use the <noscript> tag but if I have CSS on my page I want it to clear my CSS so you could read the text.
function test()
{
alert("you are using javascript!");
}body
{
background-color:#200;
}<input type="button" value="Click Me with JavaScript" onClick="test()">
<noscript>You liar! You don't have JavaScript!</noscript>The easiest thing to do is create a small css file to have the noscript CSS, like below. Note you can style the text as you want. This is just an example. You can even add your css that you want to run only in no script environment in this sheet
body:before{
content: 'Please turn on Javascript';
color: white;
font-family: sans-serif;
font-size: 2em;
font-weight: bold;
text-align: center;
width: 100%;
padding: 1em 0;
background: rgba(0,0,0,0.9);
}
Then add the following HTML
<noscript>
<link rel="stylesheet" type="text/css" href="noscript.css">
</noscript>