Scribd
Upload
5 views1 page

Htmlcssjsornek

Uploaded by

ydm66788
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
5 views1 page

Htmlcssjsornek

Uploaded by

ydm66788
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 1

<style>

body {
font-family: Arial, sans-serif;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
margin: 0;
transition: background-color 0.8s;
}

.container {
text-align: center;
}

button {
padding: 10px 20px;
font-size: 16px;
cursor: pointer;
}
</style>

<div class="container">
<p id="pp">Arka Plan Rengi Değiştirici</p>
<button id="changeColorBtn">Rengi Değiştir</button>
<p><span id="boyut">0</span></p>

<script>
const button = document.getElementById("changeColorBtn");
const heading =document.getElementById("pp")
button.addEventListener("click", function() {
const colors = ["#FF5733", "#33FF57", "#3357FF", "#FF33A1", "#FF8F33"];
const randomColor = colors[Math.floor(Math.random() * colors.length)];
const fontsz=(Math.floor(Math.random() * 30) + 10)
document.body.style.backgroundColor = randomColor;
heading.style.fontSize=fontsz+"px"
document.getElementById("boyut").innerHTML =fontsz+"px"
});

</script>

</div>

You might also like