0% found this document useful (0 votes)
37 views

HTML Codes

This document contains an enrollment form for an STI (School of Technology and Innovations) program. The form collects a student's full name, email, course selection, gender, date of birth, and address. Students submit the form to enroll in the program.

Uploaded by

HanzTzy Gaming
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
37 views

HTML Codes

This document contains an enrollment form for an STI (School of Technology and Innovations) program. The form collects a student's full name, email, course selection, gender, date of birth, and address. Students submit the form to enroll in the program.

Uploaded by

HanzTzy Gaming
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 8

<!

DOCTYPE html>
<html>
<head>
<title>STI Enrollment Form</title>
<style>
body {
font-family: Arial, sans-serif;
}
.form-container {
max-width: 400px;
margin: 0 auto;
padding: 20px;
border: 1px solid #ccc;
border-radius: 5px;
background-color: #f9f9f9;
}
.form-group {
margin-bottom: 15px;
}
.form-group label {
display: block;
font-weight: bold;
margin-bottom: 5px;
}
.form-group input[type="text"],
.form-group input[type="email"] {
width: 100%;
padding: 8px;
border: 1px solid #ccc;
border-radius: 3px;
box-sizing: border-box;
}
.form-group input[type="radio"] {
margin-right: 5px;
}
.form-group button {
padding: 10px 20px;
background-color: #007bff;
border: none;
color: #fff;
border-radius: 3px;
cursor: pointer;
}
.form-group button[type="reset"] {
background-color: #dc3545;
margin-left: 10px;
}
</style>
</head>
<body>
<div class="form-container">
<h2>STI Enrollment Form</h2>
<form id="enrollment-form">
<div class="form-group">
<label for="fullname">Full Name:</label>
<input type="text" id="fullname" name="fullname" required>
</div>
<div class="form-group">
<label for="email">Email:</label>
<input type="email" id="email" name="email" required>
</div>
<div class="form-group">
<label for="course">Select Course:</label>
<select id="course" name="course">
<option value="bsit">Bachelor of Science in Information Technology</option>
<option value="bshrm">Bachelor of Science in Hotel and Restaurant Management</option>
<option value="bsba">Bachelor of Science in Business Administration</option>
</select>
</div>
<div class="form-group">
<label>Gender:</label>
<input type="radio" id="male" name="gender" value="male" required>
<label for="male">Male</label>
<input type="radio" id="female" name="gender" value="female">
<label for="female">Female</label>
<input type="radio" id="other" name="gender" value="other">
<label for="other">Other</label>
</div>
<div class="form-group">
<label for="birthdate">Date of Birth:</label>
<input type="text" id="birthdate" name="birthdate" placeholder="YYYY-MM-DD" required>
</div>
<div class="form-group">
<label for="address">Address:</label>
<input type="text" id="address" name="address" required>
</div>
<div class="form-group">
<button type="submit">Submit</button>
<button type="reset">Reset</button>
</div>
</form>
</div>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>Planets</title>
</head>
<body>
<p>The nearest to farthest planets from the sun</p>
<ol>
<li>Mercury</li>
<li>Venus</li>
<li>Earth</li>
<li>Mars</li>
<li>Jupiter</li>
<li>Saturn</li>
<li>Uranus</li>
<li>Neptune</li>
</ol>

</body>
</html>
c. <!DOCTYPE html>
<html>
<head>
<title>Philippine Flag</title>
<style>
body {
background-color: grey;
}
.blue {
color: blue;
}

.red {
color: red;
}

.white {
color: white;
}

.yellow {
color: yellow;
}
</style>
</head>
<body background>

<p>The Philippine flag features four different colors; <span class="blue">blue</span>, <span
class="red">red</span>, <span class="white">white</span>, and <span
class="yellow">yellow</span>.</p>
</body>
</html>

You might also like