I am creating a webpage in which the user is allowed to select the page\'s backg
ID: 3546190 • Letter: I
Question
I am creating a webpage in which the user is allowed to select the page's background color and whether the page uses serif or sans serif fonts and change the body element's style attribute accordingly.
Here is my code but it doesnot seem to work. Can anyone please help?
<html>
<title>Choosing background color and font</title>
<style type = "text/css">
.option { color: darkblue }
.graybg { background-color: #aaaaaa }
.whitebg { background-color: #ffffff }
.sans { font-family: sans-serif }
.serif { font-family: serif }
</style>
<script type = "text/javascript">
function bodyClass() {
document.body.classname = class;
}
</script>
</head>
<body>
<div id = "main">Some sample text.<br /><br />
<div>Options:
<div class = "option">Gray background</div>
<div class = "option">White background</div>
<div class = "option">Sans-serif text</div>
<div class = "option">Serif text</div>
</div>
</div>
</body>
</html>
Explanation / Answer
<html>
<title>Choosing background color and font</title>
<style type = "text/css">
.option { color: darkblue }
.graybg { background-color: #aaaaaa }
.whitebg { background-color: #ffffff }
.sans { font-family: sans-serif }
.serif { font-family: serif }
</style>
<script type = "text/javascript">
function bodyClass(color) {
document.body.className = color;
}
</script>
</head>
<body>
<div id = "main">Some sample text.<br /><br />
<div>Options:
<divclass = "color">Gray background</div>
<divclass = "option">White background</div>
<divclass = "option">Sans-serif text</div>
<divclass = "option">Serif text</div>
</div>
</div>
</body>
</html>
Related Questions
Navigate
Integrity-first tutoring: explanations and feedback only — we do not complete graded work. Learn more.