0% found this document useful (0 votes)
20 views8 pages

Understanding HTML Emphasis and Alignment

The document provides an overview of various HTML elements and attributes, including the <em> tag for emphasizing text, the deprecated align attribute for text alignment, and the structure of HTML tables. It also discusses the <frame> tag for creating frames in web pages, detailing its attributes and usage. Examples are provided for each element to illustrate their implementation in HTML.

Uploaded by

dhanamyt12
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
20 views8 pages

Understanding HTML Emphasis and Alignment

The document provides an overview of various HTML elements and attributes, including the <em> tag for emphasizing text, the deprecated align attribute for text alignment, and the structure of HTML tables. It also discusses the <frame> tag for creating frames in web pages, detailing its attributes and usage. Examples are provided for each element to illustrate their implementation in HTML.

Uploaded by

dhanamyt12
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd

Emphasize test:

The <em> tag in HTML is a phrase tag and is used to emphasize the text content. It is similar
to <italic> tag. The main difference between these two tags is the <em> tag semantically
emphasizes the important word or section of words while the <i> tag is just offset text
conventionally styled in italics to show an alternative mood or voice.
Note: This effect can be achieved by using CSS property.
Syntax:
<em> Contents... </em>

Example:

<!DOCTYPE html>

<html>

<head>

<title>

How to render as emphasized

text using HTML?

</title>

</head>

<body style="text-align: center;">

<h3>

How to render as emphasized

text using HTML?

</h3>

<em>Emphasized text content</em>

</body>

</html>

Using Emphasize test

<!DOCTYPE html>

<html>

<head>

<title>
How to render as emphasized

text using HTML?

</title>

</head>

<body style="text-align: center;">

<h3>

How to render as emphasized

text using HTML?

</h3>

<em title="Emphasized text">

Emphasized text content

</em>

</body>

</html>

Output:

HTML align Attribute

HTML align Attribute in HTML is used to specify the alignment of the text content of The
Element. This attribute is used in all elements. The Align attribute can also be set using the CSS
property “text-align: ” or in <img> “vertical-align: “. For horizontal alignment, use align with
values like “left,” “center,” or “right” within appropriate tags.
Note: The align attribute is deprecated in HTML5, and styles should be used via CSS for better
practices.
Supported Tags:
 <applet>
 <caption>
 <col>
 <colgroup>
 <hr>
 <iframe>
 <img>
 <legend>
 <table>
 <tbody>
 <td>
 <tfoot>
 <th>
 <thead>
 <tr>
Syntax:
<element_name align="left | right | center | justify">
Attribute Values:
Attribute Values Description

left It sets the text left-align.

right It sets the text right-align.

center It sets the text center-align.

It stretches the text of a paragraph to set the


justify width of all lines equal.
<!DOCTYPE html>

<html>

<head>

<title>

HTML p align Attribute

</title>

</head>

<body>

<h1>GeeksforGeeks</h1>

<h2>HTML p align Attribute</h2>

<p align="left">

Left align content

</p>
<p align="center">

center align content

</p>

<p align="right">

Right align content

</p>

</body>

</html>

Output:

Table:

HTML tables allow web developers to arrange data into rows and columns.

A table in HTML consists of table cells inside rows and columns.

<table>
<tr>
<th>Company</th>
<th>Contact</th>
<th>Country</th>
</tr>
<tr>
<td>Alfreds Futterkiste</td>
<td>Maria Anders</td>
<td>Germany</td>
</tr>
<tr>
<td>Centro comercial Moctezuma</td>
<td>Francisco Chang</td>
<td>Mexico</td>
</tr>
</table>

Table Cells

Each table cell is defined by a <td> and a </td> tag.

td stands for table data.

Everything between <td> and </td> are the content of the table cell.

Example
<table>
<tr>
<td>Emil</td>
<td>Tobias</td>
<td>Linus</td>
</tr>
</table>

Table Rows

Each table row starts with a <tr> and ends with a </tr> tag.

tr stands for table row.

<table>
<tr>
<td>Emil</td>
<td>Tobias</td>
<td>Linus</td>
</tr>
<tr>
<td>16</td>
<td>14</td>
<td>10</td>
</tr>
</table>

Table Headers

Sometimes you want your cells to be table header cells. In those cases use the <th> tag instead of
the <td> tag:

th stands for table header.

<table>
<tr>
<th>Person 1</th>
<th>Person 2</th>
<th>Person 3</th>
</tr>
<tr>
<td>Emil</td>
<td>Tobias</td>
<td>Linus</td>
</tr>
<tr>
<td>16</td>
<td>14</td>
<td>10</td>
</tr>
</table>

HTML Table Tags

Tag Description

<table> Defines a table

<th> Defines a header cell in a table

<tr> Defines a row in a table

<td> Defines a cell in a table

<caption> Defines a table caption

<colgroup> Specifies a group of one or more columns in a table for formatting

<col> Specifies column properties for each column within a <colgroup> element

<thead> Groups the header content in a table


<tbody> Groups the body content in a table

<tfoot> Groups the footer content in a table

Frames:-

HTML <frame> tag is used to divide web browser windows into multiple sections, each capable
of loading content independently. This is achieved using a collection of frames within a
frameset tag.

<!DOCTYPE html>

<html>

<body>

<frameset rows="20%, 60%, 20%">

<frame name="top"

src="./attr1.html" />

<frame name="main"

src="./gradient.html" />

<frame name="bottom"

src="./colLast.html" />

<noframes>

<p>The browser you are using does not support frames.</p>

</noframes>

</frameset>

</body>

</html>

The above example basically used to create three horizontal frames i.e. top, middle and bottom
using row attribute of frameset tag and the noframe tag is used for those browser who doesn’t
support noframe
Syntax:

<frameset cols="50%, 50%">


<frame src="page1.html">
<frame src="page2.html">
</frameset>
HTML frame Tag Attributes
HTML <frame> name Attribute
This attribute is used to give names to the frame. It differentiate one frame from another. It is
also used to indicate which frame a document should loaded into.
Example
<frame name = "top" src = "C:/Users/dharam/Desktop/attr1.png" />
<frame name = "main" src = "C:/Users/dharam/Desktop/gradient3.png" />
<frame name = "bottom" src = "C:/Users/dharam/Desktop/col_last.png" />
Here we use three frames with names as left center and right.
HTML <frame> src Attribute
This attribute in frame tag is basically used to define the source file that should be loaded into
the frame.The value of src can be any url.
Example
<frame name = "left" src = "/html/left.htm" />
In the above example name of frame is left and source file will be loaded from “/html/left.htm”
in frame.
HTML <frame> marginwidth Attribute
This attribute in frame tag is used to specify width of the spaces in pixels between the border
and contents of left and right frame.
Example
<frame marginwidth="20">
HTML <frame> marginheight Attribute
This attribute in frame tag is used to specify height of the spaces in pixels between the border
and contents of top and bottom frame.
Example
<frame marginheight="20">
HTML <frame> scrollbar Attribute
To control the appearance of scroll bar in frame use scrollbar attribute in frame tag. This is
basically used to control the appearance of scrollbar. The value of this attribute can be yes, no,
auto. Where the value no denotes there will be no appearance of scroll bar.
Example
<frame scrollbar="no">

You might also like