HTML(Hyper Text Markup Language) Full Course For Beginners Lesson No 4.0

Haroon Blogger
0

 

HTML(Hyper Text Markup Language) Full Course For Beginners Lesson No 4.0


Lesson 4: HTML Links, Tables, and Multimedia


Understanding Links


In this lesson, we'll explore HTML links, tables, and multimedia elements. These components are essential for creating interactive and visually appealing webpages.

HTML Links


HTML links, created with the `<a>` element, allow users to navigate between webpages or different sections within the same webpage.

Common Attributes for Links


Let's explore some common attributes used with HTML links:

1. `href` Attribute:

   - The `href` attribute specifies the URL of the linked resource.
   - It can be a URL to another webpage, an email address, or an anchor within the same webpage.

2. `target` Attribute:

   - The `target` attribute specifies where to open the linked document.
   - Values include `_self` (opens in the same window/tab), `_blank` (opens in a new window/tab), `_parent`, and `_top`.

HTML Tables


HTML tables, created with the `<table>` element, allow you to display data in rows and columns.

Common Elements in Tables


Let's explore some common elements used within HTML tables:

1. `<table>` Element:

   - The `<table>` element defines a table.
   - It contains one or more `<tr>` (table row) elements.

2. `<tr>` Element:

   - The `<tr>` element defines a row within a table.
   - It contains one or more `<td>` (table data/cell) elements.

3. `<td>` Element:

   - The `<td>` element defines a single cell within a table row.
   - It contains the data to be displayed in that cell.

Multimedia Elements


HTML supports embedding multimedia elements like images, audio, and video.

Common Multimedia Elements


Let's explore some common multimedia elements in HTML:

1. `<img>` Element:

   - The `<img>` element embeds images into webpages.
   - It requires the `src` attribute, which specifies the path to the image file.

2. `<audio>` Element:

   - The `<audio>` element embeds audio content into webpages.
   - It supports various audio formats, such as MP3, WAV, and Ogg Vorbis.

3. `<video>` Element:

   - The `<video>` element embeds video content into webpages.
   - It supports various video formats, such as MP4, WebM, and Ogg Theora.

Example: Using Links, Tables, and Multimedia Elements

Let's apply what we've learned in a practical example:


HTML
```html
<!DOCTYPE html>
<html>
<head>
    <title>HTML Links, Tables, and Multimedia</title>
</head>
<body>
    <h1>HTML Links, Tables, and Multimedia</h1>
    
    <h2>Links</h2>
    <a href="https://www.example.com">Visit Example Website</a>
    
    <h2>Tables</h2>
    <table border="1">
        <tr>
            <td>Row 1, Column 1</td>
            <td>Row 1, Column 2</td>
        </tr>
        <tr>
            <td>Row 2, Column 1</td>
            <td>Row 2, Column 2</td>
        </tr>
    </table>
    
    <h2>Multimedia</h2>
    <img src="image.jpg" alt="Description of image">
    <audio controls>
        <source src="audio.mp3" type="audio/mpeg">
        Your browser does not support the audio element.
    </audio>
    <video controls>
        <source src="video.mp4" type="video/mp4">
        Your browser does not support the video element.
    </video>
</body>
</html>
```

Explanation


In this example, we've used HTML links to create a hyperlink to an external webpage. We've also created a simple table with two rows and two columns. Additionally, we've embedded an image, audio, and video elements into the webpage for multimedia content.

Exercise


Practice creating HTML links, tables, and embedding multimedia elements into your webpages. Experiment with different attributes and elements to understand their functionalities better.


HTML Viewer
Tags

Post a Comment

0Comments

Post a Comment (0)
To Top