Dashboard Temp Share Shortlinks Frames API

HTMLify

gcertificate.html
Views: 587 | Author: sachinthakur 
  1
  2
  3
  4
  5
  6
  7
  8
  9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
 21
 22
 23
 24
 25
 26
 27
 28
 29
 30
 31
 32
 33
 34
 35
 36
 37
 38
 39
 40
 41
 42
 43
 44
 45
 46
 47
 48
 49
 50
 51
 52
 53
 54
 55
 56
 57
 58
 59
 60
 61
 62
 63
 64
 65
 66
 67
 68
 69
 70
 71
 72
 73
 74
 75
 76
 77
 78
 79
 80
 81
 82
 83
 84
 85
 86
 87
 88
 89
 90
 91
 92
 93
 94
 95
 96
 97
 98
 99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Get Certificate</title>
</head>
<body>
  <header>
    <nav>
      <div class="navbar">
        <ul class="nav-links">
          <li><a href="#">Home</a></li>
          <li><a href="#">About</a></li>
          <li><a href="#">Contact</a></li>
        </ul>
      </div>
    </nav>
  </header>

  <div class="container">
    <h2>Get Certificate</h2>
    <form id="certificateForm">
      <div class="form-group">
        <label for="studentName">Student Name:</label>
        <input type="text" id="studentName" name="studentName" required>
      </div>
      <div class="form-group">
        <label for="rollNumber">Roll Number:</label>
        <input type="text" id="rollNumber" name="rollNumber" required>
      </div>
      <button type="submit">Get Certificate</button>
    </form>
   
  </div>
</body>
</html>

<style>

body {
    font-family: Arial, sans-serif;
    margin: 0;
    padding: 0;
    background-image: url('https://img.freepik.com/premium-photo/graduation-diploma-hand-isolated-white_392895-96287.jpg');
  }
  
  header {
    background-color: #047dff;
    color: #fff;
    padding: 10px 0;
  }
  
  .container {
    max-width: 400px;
    margin: 0 auto;
    padding: 20px;
    background-color: aquamarine;
    margin-top: 50px;
  }
  
  .navbar {
    max-width: 400px;
    margin: 0 auto;
    padding: 20px;

    
  }

  .navbar a:hover{
    background-color: red;
  }
  
  .nav-links {
    list-style: none;
    padding: 0;
    margin: 0;
  }
  
  .nav-links li {
    display: inline;
    margin-right: 20px;
  }
  
  .nav-links li:last-child {
    margin-right: 0;
  }
  
  .nav-links a {
    color: #fff;
    text-decoration: none;
  }
  
  .form-group {
    margin-bottom: 15px;
  }
  
  label {
    display: block;
    margin-bottom: 5px;
  }
  
  input[type="text"] {
    width: 100%;
    padding: 8px;
    border: 1px solid #ccc;
    border-radius: 3px;
  }
  
  button {
    background-color: #007bff;
    color: #fff;
    padding: 10px 20px;
    border: none;
    border-radius: 3px;
    cursor: pointer;
  }
  
  button:hover {
    background-color: #0056b3;
  }
  
 
  </style>

Share this file: