Menu
I want to make a button that imports the styles in a .css file.
Any way to do this? If not, what I am aiming for it to change multiple css properties with buttons, essentially creating themes for the website.
CSS file:
.body {
background-image: url("example.png");
}
HTML file:
<html>
<head>
<script>
// ???
</script>
</head>
<body>
<button onclick="???">Import!</button>
</body>
</html>
EDIT: Anything, such as jQuery, can be used, as long as specified, to get the job done! I just NEED to make this work!
918
asked Jan 21 '26 16:01
I've done this a couple times. Here is a good tutorial.
You can use JS that targets your href attribute to load a new stylesheet.
<link id="pagestyle" rel="stylesheet" type="text/css" href="default.css">
<script>
function swapStyleSheet(sheet){
document.getElementById('pagestyle').setAttribute('href', sheet);
}
</script>
<button onclick="swapStyleSheet('new.css')">New Style Sheet</button>
<button onclick="swapStyleSheet('default.css')">Default Style Sheet</button>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With