Here is an example of an attractive frontend for a website that takes three numerical inputs and a submit button using Bootstrap:
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Check Eligibility</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
<style>
body {
background-color: #f5f5f5;
}
.container {
max-width: 500px;
margin: 40px auto;
padding: 20px;
background-color: #fff;
border: 1px solid #ddd;
box-shadow: 0 0 10px rgba(0,0,0,0.1);
}
.form-control {
height: 40px;
font-size: 18px;
padding: 10px;
}
.btn {
width: 100%;
height: 40px;
font-size: 18px;
padding: 10px;
border: none;
border-radius: 5px;
background-color: #337ab7;
color: #fff;
cursor: pointer;
}
.btn:hover {
background-color: #23527c;
}
</style>
</head>
<body>
<div class="container">
<h2>Check Eligibility</h2>
<form>
<div class="form-group">
<label for="income">Income</label>
<input type="number" class="form-control" id="income" required>
</div>
<div class="form-group">
<label for="age">Age</label>
<input type="number" class="form-control" id="age" required>
</div>
<div class="form-group">
<label for="credit-score">Credit Score</label>
<input type="number" class="form-control" id="credit-score" required>
</div>
<button type="submit" class="btn">Check Eligibility</button>
</form>
</div>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
</body>
</html>
```
This code uses Bootstrap 4 to create a responsive and attractive frontend. The form is wrapped in a container with a max-width of 500px, which will center the form on larger screens. The form inputs and button are styled using Bootstrap's built-in classes. The `.form-control` class is used to style the input fields, and the `.btn` class is used to style the submit button.
Note that this code does not include any JavaScript functionality for submitting the form or handling the input values. You will need to add your own JavaScript code to handle the form submission and validation.
Also, you can customize the design as per your requirement.
Let me know if you need any further assistance!
PDFClean.ai
Mini tools
