1.1.

2 HTML Links and Attributes:

Links in HTML are used to connect different web pages and allow users to navigate between
them. The anchor tag, <a>, is used to create a hyperlink.

The attributes used with anchor tags are:

- href: specifies the URL of the page to which the link goes.
- target: specifies where to open the linked page. The values used with target are _self, _blank,
_parent, and _top.

_self: opens the linked page in the same tab

_blank: opens the linked page in a new tab

_parent: opens the linked page in the parent frame

_top: opens the linked page in the full body of the window

Example:

<a href="https://www.google.com" target="_blank">Go to Google</a>

1.1.3 Absolute URL and Relative URL in <href>

- Absolute URL: It contains a fully qualified URL, including the protocol and domain name.
Syntax: <a href="https://www.example.com">Link Text</a>
- Relative URL: It is used when the linked page is in the same website as the current page. It
only contains the path to the file.
Syntax: <a href="/path/to/file.html">Link Text</a>

1.1.4 <img> tag and its attributes (src, alt, style, width, height)

The <img> tag is used to embed a single image on a web page.

The attributes used with the <img> tag are:

- src: specifies the URL of the image.

- alt: provides text for screen readers and when the image cannot be displayed.
- style: specifies the style of the image.
- width: specifies the width of the image.
- height: specifies the height of the image.

Example:

<img src="example.jpg" alt="Example Image" style="width: 500px; height: 400px">

1.2 HTML Forms:

HTML forms are used to collect user input. The <form> tag is used to create a form.

1.2.1 Form elements and their attributes:

1.2.1.1 <form> (action, method, novalidate, autocomplete, target)

- action: specifies where to send the form data.
- method: specifies the HTTP method to use for submitting the form data. The values used with
method are "get" and "post".
- novalidate: specifies that the form should not be validated by the browser.
- autocomplete: specifies if the form should autocomplete.
- target: specifies where to open the result page.

Example:

<form action="process-form.php" method="POST" novalidate autocomplete="off"

target="_blank">
...
</form>

1.2.1.2 <label>, <input> (text, radio button, checkboxes, submit/reset button)

- <label>: used to associate a label with a form control

- <input>: used for multiple types of form controls.

For text input:

<input type="text" name="username">

For radio buttons:

<input type="radio" name="gender" value="male"> Male
<input type="radio" name="gender" value="female"> Female

For checkboxes:
<input type="checkbox" name="interest[]" value="books"> Books
<input type="checkbox" name="interest[]" value="music"> Music
<input type="checkbox" name="interest[]" value="movies"> Movies

For submit/reset button:

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

<input type="reset" value="Reset">

1.2.1.3 <select>(id, name, <option>)

- <select>: used to create a drop-down list.

- <option>: used to create an option for the select element.

<select id="cars" name="cars">

<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</select>

1.2.1.4 <textarea>(name, rows, cols)

- <textarea>: used for multi-line text input.

<textarea name="message" rows="4" cols="50">

Enter your message here.
</textarea>
1.2.1.5 <button>(type, onclick)

- <button>: used to create a clickable button.

<button type="button" onclick="alert('Hello World!')">Click Me</button>

1.2.1.6 <datalist>

- <datalist>: used to provide a predefined list of options for input.

<input list="browsers">

<datalist id="browsers">
<option value="Chrome">
<option value="Firefox">
<option value="Internet Explorer">
<option value="Opera">
<option value="Safari">
</datalist>

1.2.2 Media: Video, Audio detailed notes with example for above syllabus

Media elements such as videos and audios can be added to HTML using the <video> and
<audio> tags.

Example:
<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>

<audio controls>
<source src="sound.mp3" type="audio/mpeg">
<source src="sound.ogg" type="audio/ogg">
Your browser does not support the audio tag.
</audio>