Simple HTML Game: Hover and Change Color
<!DOCTYPE html>
<html>
<head>
<title>Simple HTML Game: Hover and Change Color</title>
<style>
body {
display: flex;
flex-direction: column;
}
<pre><code> #game {
display: flex;
flex-direction: row;
width: 500px;
height: 500px;
border: solid 1px black;
}
#game > div {
flex: 1 1 auto;
}
.block {
width: 100%;
height: 100%;
background-color: blue;
}
</style>
</head>
<body>
<div id='game'>
<div class='block' onmouseover='this.style.backgroundColor='red';' onmouseout='this.style.backgroundColor='blue';'></div>
<div class='block' onmouseover='this.style.backgroundColor='red';' onmouseout='this.style.backgroundColor='blue';'></div>
<div class='block' onmouseover='this.style.backgroundColor='red';' onmouseout='this.style.backgroundColor='blue';'></div>
<div class='block' onmouseover='this.style.backgroundColor='red';' onmouseout='this.style.backgroundColor='blue';'></div>
</div>
</body>
</code></pre>
</html>
原文地址: https://www.cveoy.top/t/topic/lniW 著作权归作者所有。请勿转载和采集!