Certainly! To create a simple program that checks whether a person is eligible for voting or not using HTML, CSS, JavaScript, and Python, you can follow these steps:
1. Create the HTML structure in a file named `voting.html`:
html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<title>Voting Eligibility Checker</title>
</head>
<body>
<div class="container">
<h1>Voting Eligibility Checker</h1>
<label for="ageInput">Enter your age:</label>
<input type="number" id="ageInput" min="0" step="1">
<button id="checkButton">Check Eligibility</button>
<p id="result"></p>
</div>
<script src="script.js"></script>
</body>
</html>
2. Create the CSS styling in a file named `style.css`:
css
body {
font-family: Arial, sans-serif;
background-color: #f4f4f4;
margin: 0;
padding: 0;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
}
.container {
text-align: center;
background-color: #fff;
padding: 20px;
border-radius: 5px;
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
}
button {
padding: 10px 20px;
background-color: #007bff;
color: #fff;
border: none;
border-radius: 5px;
cursor: pointer;
}
button:hover {
background-color: #0056b3;
}
3. Create the JavaScript logic in a file named `script.js`:
javascript
document.addEventListener("DOMContentLoaded", function () {
const ageInput = document.getElementById("ageInput");
const checkButton = document.getElementById("checkButton");
const result = document.getElementById("result");
checkButton.addEventListener("click", function () {
const age = parseInt(ageInput.value);
if (isNaN(age)) {
result.textContent = "Please enter a valid age.";
return;
}
if (age >= 18) {
result.textContent = "You are eligible to vote!";
} else {
result.textContent = "You are not eligible to vote yet.";
}
});
});
4. Run a Python web server to host the files. Open your terminal and navigate to the directory containing the HTML, CSS, and JavaScript files, then run the following command:
python -m http.server
5. Open your web browser and go to `http://localhost:8000/voting.html`. You should see the voting eligibility checker form. Enter an age and click the "Check Eligibility" button to see the result.
Remember to have Python installed on your system and ensure that the terminal's working directory is where your HTML, CSS, and JavaScript files are located.
Silan Software is one of the India's leading provider of offline & online training for Java, Python, AI (Machine Learning, Deep Learning), Data Science, Software Development & many more emerging Technologies.
We provide Academic Training || Industrial Training || Corporate Training || Internship || Java || Python || AI using Python || Data Science etc