以下是一份方舟手游矿洞找水晶的代码,长度约为 300 字:
```html
body {
font-family: Arial, sans-serif;
background-color: #f0f0f0;
margin: 0;
padding: 0;
}
.container {
max-width: 800px;
margin: 0 auto;
padding: 20px;
}
h1 {
text-align: center;
color: #333;
}
.map {
display: flex;
flex-wrap: wrap;
justify-content: center;
margin-top: 20px;
}
.tile {
width: 50px;
height: 50px;
background-color: #ccc;
margin: 5px;
display: flex;
justify-content: center;
align-items: center;
font-size: 24px;
cursor: pointer;
}
.tile.crystal {
background-color: #9370db;
color: #fff;
}
.tile.active {
background-color: #4caf50;
color: #fff;
}
document.addEventListener('DOMContentLoaded', function() {
var map = document.querySelector('.map');
var crystals = [];
var activeTiles = [];
// 生成随机矿洞
for (var i = 0; i < 100; i++) {
var tile = document.createElement('div');
tile.classList.add('tile');
if (Math.random() < 0.1) {
tile.classList.add('crystal');
crystals.push(tile);
}
map.appendChild(tile);
}
// 处理点击事件
map.addEventListener('click', function(event) {
var tile = event.target;
if (tile.classList.contains('tile')) {
if (tile.classList.contains('crystal')) {
tile.classList.add('active');
activeTiles.push(tile);
} else {
alert('这里没有水晶!');
}
}
});
});
```
这段代码使用 HTML、CSS 和 JavaScript 创建了一个简单的矿洞探索游戏。玩家需要点击屏幕上随机生成的瓷砖,找到隐藏的水晶。当点击到水晶时,水晶瓷砖会变绿色,表示已找到。这个代码可以作为开发类似游戏的基础,可以根据需求进行进一步的扩展和优化。