Program4

 <!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<meta http-equiv="X-UA-Compatible" content="ie=edge">

<title>Registration Form</title>

<style>

/* Basic styling for the page */

body {

font-family: Arial, sans-serif;

background-color: #f4f4f9;

color: #333;

margin: 0;

padding: 20px;

}

h1 {

text-align: center;

color: #4CAF50;

font-size: 36px;

}

/* Table for form layout */

table {

width: 60%;

margin: 0 auto;

border-collapse: collapse;

}

td {

padding: 10px;

font-size: 16px;

}

/* Styling for input fields and labels */

input[type="text"], input[type="email"], input[type="password"],

select {

width: 100%;

padding: 8px;

border: 1px solid #ccc;

border-radius: 4px;

background-color: #f9f9f9;

}

input[type="radio"], input[type="checkbox"] {

margin-right: 10px;

}

input[type="submit"] {

background-color: #4CAF50;

color: white;

border: none;

padding: 12px 20px;

font-size: 18px;

cursor: pointer;

border-radius: 5px;

width: 100%;

}

input[type="submit"]:hover {

background-color: #45a049;

}

/* Style for form section headers */

.form-section {

background-color: #e2f1e3;

padding: 10px;

margin-bottom: 10px;

font-weight: bold;

text-align: center;

}

/* Style for error messages */

.error {

color: red;

font-size: 14px;

}

</style>

</head>

<body>

<h1>User Registration Form</h1>

<form action="#" method="post">

<!-- User Information Section -->

<div class="form-section">Personal Information</div>

<table>

<tr>

<td><label for="firstName">First Name:</label></td>

<td><input type="text" id="firstName" name="firstName"

required></td>

</tr>

<tr>

<td><label for="lastName">Last Name:</label></td>

<td><input type="text" id="lastName" name="lastName"

required></td>

</tr>

<tr>

<td><label for="email">Email Address:</label></td>

<td><input type="email" id="email" name="email" required></td>

</tr>

<tr>

<td><label for="dob">Date of Birth:</label></td>

<td><input type="date" id="dob" name="dob" required></td>

</tr>

</table>

<!-- Gender Section -->

<div class="form-section">Gender</div>

<table>

<tr>

<td><label>Gender:</label></td>

<td>

<input type="radio" id="male" name="gender"

value="Male"><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>

</td>

</tr>

</table>

<!-- Subscription Section -->

<div class="form-section">Subscription</div>

<table>

<tr>

<td><label>Would you like to subscribe to our

newsletter?</label></td>

<td>

<input type="checkbox" id="subscribe" name="subscribe"

value="Yes">

<label for="subscribe">Yes, subscribe me to the

newsletter</label>

</td>

</tr>

</table>

<!-- Country Selection Section -->

<div class="form-section">Country</div>

<table>

<tr>

<td><label for="country">Select Country:</label></td>

<td>

<select id="country" name="country">

<option value="usa">United States</option>

<option value="canada">Canada</option>

<option value="uk">United Kingdom</option>

<option value="india">India</option>

<option value="australia">Australia</option>

</select>

</td>

</tr>

</table>

<!-- Password Section -->

<div class="form-section">Account Information</div>

<table>

<tr>

<td><label for="password">Password:</label></td>

<td><input type="password" id="password" name="password"

required></td>

</tr>

<tr>

<td><label for="confirmPassword">Confirm

Password:</label></td>

<td><input type="password" id="confirmPassword"

name="confirmPassword" required></td>

</tr>

</table>

<!-- Submit Button -->

<div>

<input type="submit" value="Register">

</div>

</form>

</body>

</html>

Comments

Post a Comment

Popular posts from this blog

Plantation

Image
 Social connectivity & responsibility Module - 1 A plantation is an extensive agricultural estate dedicated to the large-scale cultivation of specific crops, often characterized by a single type of plant dominating vast areas. This agricultural model has historical roots in colonial economies where crops such as sugar, tobacco, and cotton were cultivated for export.   The term "plantation" is not only associated with historical practices but is also relevant in contemporary contexts, especially in the cultivation of cash crops like tea, coffee, rubber, and palm oil. Modern plantations may strive to balance agricultural productivity with environmental sustainability, employing responsible land management and ethical labor practices. As agriculture continues to evolve, the concept of plantations plays a crucial role in discussions about food production, economic development, and environmental conservation.  As global perspectives on agriculture shift towards sustainabil...
Read more

Program9

 <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>jQuery Combined Example</title> <style> body { font-family: Arial, sans-serif; margin: 20px; text-align: center; } p, ul { margin: 20px 0; } #box { width: 100px; height: 100px; background-color: #2196f3; margin: 20px auto; } button { padding: 10px 15px; margin: 10px 5px; cursor: pointer; background-color: #4caf50; color: white; border: none; border-radius: 5px; } button:hover { background-color: #388e3c; } </style> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> </head> <body> <h1>jQuery Combined Example</h1> <!-- Content to append to --> <p id="paragraph">This is a paragraph.</p> <ul id="list"> <li>Item 1</li> <li>Item 2</li> </ul> <!...
Read more

Program8

 8(a) Visitor Counter (PHP) : <?php // File to store the visitor count $counterFile = "counter.txt"; // Check if the file exists, if not, create it and set count to 0 if (!file_exists($counterFile)) {  file_put_contents($counterFile, 0); } // Read the current count from the file $visitorCount = (int)file_get_contents($counterFile); // Increment the count $visitorCount++; // Save the updated count back to the file file_put_contents($counterFile, $visitorCount); ?> <!DOCTYPE html> <html lang="en"> <head>  <meta charset="UTF-8">  <meta name="viewport" content="width=device-width, initial-scale=1.0">  <title>Visitor Counter</title> <style>  body {  font-family: Arial, sans-serif;  text-align: center;  background-color: #f0f8ff;  }  h1 {  color: #333;  }  p {  font-size: 1.2em;  color: #555;  }  </style> </head> <body>  <h1...
Read more