Ex1:
===
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>HTML & HTML5</title>
</head>
<body>
<hr>
<ol>
<li>Full Stack Python Development
<ul>
<li>Core Python</li>
<li>Advance Python</li>
<li>FrontEnd with Django</li>
<li>Cloud Technologies</li>
<li>Live Project Implementation</li>
</ul>
</li>
<li>Full Stack Java Developmenr
<ul>
<li>Core Java</li>
<li>Advance Java</li>
<li>FrontEnd with Springboot</li>
<li>Live Projects</li>
</ul>
</li>
</ol>
<hr>
</body>
</html>
Note:
====
In HTML & HTML5 list tags are used to create dropmenu or navigation menu's
Working with table tag:
==============
HTML & HTML5 supports table [Link] is paired [Link] main objective of
table tag is to represent the data or information tabular format
<table>
<tr>
<th></th>
</tr>
<tr>
<td></td>
</tr>
</table>
Ex1:
==
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>HTML & HTML5</title>
</head>
<body>
<hr>
<center>
<h1><tt>Product_Information</tt></h1>
</center>
<hr>
<br>
<hr>
<center>
<table border="2">
<tr>
<th>Pid</th>
<th>Pname</th>
<th>Price</th>
<th>Company</th>
<th>M_Date</th>
<th>Exp_date</th>
</tr>
<tr>
<td>1001</td>
<td>Mobile_1</td>
<td>20000</td>
<td>S1</td>
<td>2024</td>
<td>2025</td>
</tr>
<tr>
<td>1002</td>
<td>Mobile_2</td>
<td>30000</td>
<td>S2</td>
<td>2025</td>
<td>2026</td>
</tr>
<tr>
<td>1003</td>
<td>Mobile_3</td>
<td>40000</td>
<td>S3</td>
<td>2027</td>
<td>2028</td>
</tr>
<tr>
</tr>
<td>1004</td>
<td>Mobile_3</td>
<td>40000</td>
<td>S3</td>
<td>2027</td>
<td>2028</td>
</tr>
<tr></tr>
<td>1005</td>
<td>Mobile_3</td>
<td>40000</td>
<td>S3</td>
<td>2027</td>
<td>2028</td>
</tr>
</table>
</center>
<hr>
</body>
</html>
form tag in HTML & HTML5:
==================
HTML & HTML5 supports form [Link] main objective of form tag is collect the
end_user data/information and sends to the [Link] is the syntax for
form tag.
<form method="get/post"></form>
There are three types of forms:
===================
->inline form
->vertical form
->horizontal form
form has following form components
========================
input tag:
=======
input tag is a form [Link] main objective of input tag is create a text
field.
<input type="text" />
Ex1:
==
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>HTML & HTML5</title>
</head>
<body>
<hr>
<center>
<h1><tt>HTML & HTML5</tt></h1>
</center>
<hr>
<br>
<hr>
<center>
<form action="" method="get">
<label for="">First_Name</label>
<input type="text">
</form>
</center>
<hr>
</body>
</html>
Ex2:
===
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>HTML & HTML5</title>
</head>
<body>
<hr>
<center>
<h1><tt>HTML & HTML5</tt></h1>
</center>
<hr>
<br>
<hr>
<center>
<form action="" method="get">
<input type="text" placeholder="First_Name" title="text_field">
</form>
</center>
<hr>
</body>
</html>
Inline form:
=======
Ex1:
===
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>HTML & HTML5</title>
</head>
<body>
<hr>
<center>
<h1><tt>Inline_Form</tt></h1>
</center>
<hr>
<br>
<hr>
<center>
<form action="" method="get">
<label for="">Username</label>
<input type="text" placeholder="Username" required title="text-field
for username">
<label for="">Password</label>
<input type="password" placeholder="password" required title="text-
field for password">
<input type="submit" value="LOGIN">
<input type="reset" value="RESET">
</form>
</center>
<hr>
</body>
</html>
Rahul_123 ---->Username --->pattern
RA_12345 ---->password ----->pattern
[A-Z]{1}[a-z]*[_]{1}[0-9]{3}
[A-Z]{2}[_]{1}[0-9]{5}