<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<button onclick="Redtheme()">Red theme</button>
<button onclick="Bluetheme()">Blue theme</button>
<button onclick="Increasefont()">Increase font</button>
<button onclick="Decreasefont()">Decrease font</button>
<button onclick="Textcolor()">Text color</button>
<p id="a" style="background-color: beige; border: 2px
solid black; border-radius:groove;" >Lorem ipsum dolor sit
amet consectetur adipisicing elit. Eveniet, consequatur
veritatis consequuntur in dolorum repudiandae eos. Quos
possimus voluptas voluptatibus! Lorem ipsum, dolor sit
amet consectetur adipisicing elit. Qui optio molestias
laboriosam, voluptas cupiditate minima ad a fuga aperiam
excepturi neque, natus eum doloribus, alias rerum totam
voluptates consequatur. Amet?</p>
</body>
<script>
function Redtheme()
{
document.getElementById("a").style.backgroundcolor="red"
}
function Bluetheme()
{
document.getElementById("a").style.backgroundcolor="blue"
}
function Increasefont()
{
document.getElementById("a").style.fontSize="30px"
}
function Decreasefont()
{
document.getElementById("a").style.fontSize="20px"
}
function Textcolor()
{
document.getElementById("a").style.color="red"
}
</script>
</html>
No comments:
Post a Comment