|
<!DOCTYPE html> |
|
<html lang="en"> |
|
|
|
<head> |
|
<meta charset="UTF-8"> |
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
<title>Document</title> |
|
<style></style> |
|
</head> |
|
|
|
<body> |
|
|
|
|
|
<!-- Text content tags --> |
|
<!-- 1. Header tag <h1> -- <h2> <h3> <h4 <h5>---- <h6> --> |
|
|
|
<b>Hello world, I am writing my first HTML code</b> |
|
<h1> Here is a H1 tag </h1> |
|
<h2> Here is a H2 tag </h2> |
|
|
|
<!-- <p> --> |
|
<p> This is a paragraph of text</p> |
|
|
|
<!-- <a> anchor tags --> |
|
<a href="signup.html">Visit login</a> |
|
|
|
<!-- Strong tag --> |
|
<strong>This is an emphasy</strong> |
|
|
|
|
|
|
|
<!-- LIST TAGs --> |
|
<!-- <li> defines list </li> --> |
|
<!-- <ul>This defins an unordered list (bulleted) </ul> --> |
|
<!-- <ol> This is an ordered list</ol> --> |
|
<ul> |
|
<li>Item 1</li> |
|
<li>Item 2</li> |
|
</ul> |
|
|
|
<ol> |
|
<li>First Item</li> |
|
<li>Second Item</li> |
|
<li>Second Item</li> |
|
<li>Second Item</li> |
|
</ol> |
|
|
|
|
|
<!-- MEDIA TAG --> |
|
<!-- Image --> |
|
<!-- <img> --> |
|
<img src="image.jpg" alt="A beautiful scenery" width="500" height="300"> |
|
|
|
<!-- <audio> --> |
|
<!-- Embeds audio and video files, respectively. --> |
|
<audio controls> |
|
<source src="audio.mp3" type="audio/mpeg"> |
|
Your browser does not support the audio element. |
|
</audio> |
|
|
|
<video width="320" height="240" controls> |
|
<source src="movie.mp4" type="video/mp4"> |
|
Your browser does not support the video tag. |
|
</video> |
|
|
|
|
|
<!-- Table Tags --> |
|
<!-- <table> </table> --> |
|
<!-- <tr> defines a table row,--> |
|
<!-- <th> defines a header cell, --> |
|
<!-- <td> defines a standard cell. --> |
|
|
|
<table> |
|
<tr> |
|
<th>Name</th> |
|
<th>Age</th> |
|
</tr> |
|
<tr> |
|
<td>John</td> |
|
<td>30</td> |
|
</tr> |
|
<tr> |
|
<td>Jane</td> |
|
<td>25</td> |
|
</tr> |
|
</table> |
|
|
|
<!-- Form Tags --> |
|
<!-- Defines an HTML form for user input. --> |
|
<!-- <input> Defines an input field. --> |
|
<!-- <label> Defines a label for an input element. --> |
|
<!-- <select> reates a drop-down list --> |
|
<!-- <option>defines the options</option> --> |
|
<!-- <textarea> creates a multi-line text input.--> |
|
|
|
<form action="/submit" method="post"> |
|
<label for="name">Name:</label> |
|
<input type="text" id="name" name="name"> |
|
<input type="submit" value="Submit"> |
|
|
|
<select name="cars"> |
|
<option value="volvo">Volvo</option> |
|
<option value="saab">Saab</option> |
|
</select> |
|
|
|
<textarea name="message" rows="4" cols="50"> |
|
Enter your message here. |
|
</textarea> |
|
|
|
</form> |
|
|
|
|
|
</body> |
|
|
|
</html> |
