Basic structure of an HTML document, basic text formatting, links, images, tables, frames, form and introduction to CSS

10/03/2023 0 By indiafreenotes

The basic structure of an HTML document has already been explained in the previous answer. Here, we will go through some basic HTML elements and how to use them.

Basic Text Formatting

HTML provides a set of tags to format text. Some of the commonly used tags for formatting text are:

  • <b>: Bold text
  • <i>: Italic text
  • <u>: Underline text
  • <em>: Emphasized text
  • <strong>: Strong text

<p>This is <b>bold</b>, <i>italic</i>, <u>underline</u>, <em>emphasized</em>, and <strong>strong</strong> text.</p>

Links

Links are used to connect one web page to another. The <a> tag is used to create links. The href attribute is used to specify the destination of the link. Here is an example:

<a href=”http://www.example.com”>This is a link to example.com</a>

Images

Images can be displayed on web pages using the <img> tag. The src attribute is used to specify the location of the image file. Here is an example:

<img src=”image.jpg” alt=”An image”>

The alt attribute provides alternative text for screen readers and search engines.

Tables

Tables can be used to display data in rows and columns. The <table> tag is used to create a table. The <tr> tag is used to create a row, and the <td> tag is used to create a cell in the row. Here is an example:

<table>

            <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>

Frames

Frames are used to divide a web page into multiple sections, each with its own content. The <frame> tag is used to create a frame. Here is an example:

<frameset cols=”25%, 75%”>

            <frame src=”menu.html”>

            <frame src=”content.html”>

</frameset>

The cols attribute specifies the size of each frame.

Forms

Forms are used to collect input from users. The <form> tag is used to create a form. Input fields such as text boxes, radio buttons, and checkboxes are defined using various input tags. Here is an example:

<form action=”submit.php” method=”post”>

            <label for=”name”>Name:</label>

            <input type=”text” id=”name” name=”name”>

            <br>

            <label for=”email”>Email:</label>

            <input type=”email” id=”email” name=”email”>

            <br>

            <label for=”message”>Message:</label>

            <textarea id=”message” name=”message”></textarea>

            <br>

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

</form>

The action attribute specifies the URL to which the form data will be sent. The method attribute specifies the HTTP method to use (usually post or get). The label tag provides a label for each input field.

Introduction to CSS

CSS (Cascading Style Sheets) is used to style and layout HTML elements. CSS provides a way to define the visual presentation of HTML elements, such as font size, color,