<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>로또 번호 생성기</title>
<style>
body {
font-family: Arial, sans-serif;
text-align: center;
margin-top: 50px;
background-color: #f4f4f4;
}
h1 {
color: #333;
}
button {
padding: 12px 25px;
font-size: 16px;
cursor: pointer;
border: none;
background-color: #4CAF50;
color: white;
border-radius: 5px;
}
button:hover {
background-color: #45a049;
}
.result {
margin-top: 30px;
font-size: 20px;
line-height: 1.8;
}
.set {
margin: 10px 0;
}
</style>
</head>
<body>
<h1>🎰 로또 번호 생성기</h1>
<button onclick="generateLotto()">번호 생성</button>
<div class="result" id="result"></div>
<script>
function generateOneSet() {
let numbers = [];
while (numbers.length < 6) {
let num = Math.floor(Math.random() * 45) + 1;
if (!numbers.includes(num)) {
numbers.push(num);
}
}
// 오름차순 정렬
return numbers.sort((a, b) => a - b);
}
function generateLotto() {
let output = "";
for (let i = 1; i <= 5; i++) {
let set = generateOneSet();
output += `<div class="set">🎯 ${i}번: ${set.join(" , ")}</div>`;
}
document.getElementById("result").innerHTML = output;
}
</script>
</body>
</html>