Scribd
Upload
34 views

The HTML Element: HTML and Elements

The document describes various HTML elements for formatting text, including elements for bold, italic, emphasized, deleted, inserted, subscripted, and superscripted text. It also covers elements for defining preformatted text, smaller text, marked text, unordered and ordered lists, tables, and table captions. Elements like <b>, <i>, <pre>, <ul>, <ol>, and <table> are explained along with their purpose and examples of usage.

Uploaded by

md jahid
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
34 views

The HTML Element: HTML and Elements

The document describes various HTML elements for formatting text, including elements for bold, italic, emphasized, deleted, inserted, subscripted, and superscripted text. It also covers elements for defining preformatted text, smaller text, marked text, unordered and ordered lists, tables, and table captions. Elements like <b>, <i>, <pre>, <ul>, <ol>, and <table> are explained along with their purpose and examples of usage.

Uploaded by

md jahid
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 6

The HTML <pre> Element

The HTML <pre> element defines preformatted text.


The text inside a <pre> element is displayed in a fixed-width font (usually Courier), and it
preserves both spaces and line breaks:
<pre>
My Bonnie lies over the ocean.

My Bonnie lies over the sea.

My Bonnie lies over the ocean.

Oh, bring back my Bonnie to me.


</pre>

HTML <b> and <strong> Elements


The HTML <b> element defines bold text, without any extra importance.
<b>This text is bold</b>
The HTML <strong> element defines strong text, with added semantic
"strong" importance.
<strong>This text is strong</strong>

HTML <i> and <em> Elements


The HTML <i> element defines italic text, without any extra importance.
<i>This text is italic</i>
The HTML <em> element defines emphasized text, with added semantic importance.
<em>This text is emphasized</em>

HTML <small> Element


The HTML <small> element defines smaller text:

<h2>HTML <small>Small</small> Formatting</h2>

HTML <mark> Element


The HTML <mark> element defines marked or highlighted text:

<h2>HTML <mark>Marked</mark> Formatting</h2>

HTML <del> Element


<p>My favorite color is <del>blue</del> red.</p>
HTML <ins> Element
The HTML <ins> element defines inserted (added) text.

<p>My favorite <ins>color</ins> is red.</p>

HTML <sub> Element


The HTML <sub> element defines subscripted text.

<p>This is <sub>subscripted</sub> text.</p>

HTML <sup> Element


The HTML <sup> element defines superscripted text.

<p>This is <sup>superscripted</sup> text.</p>

HTML Lists
1 Unordered List:

2 Ordered List:

Unordered HTML List


An unordered list starts with the <ul> tag. Each list item starts with the <li> tag.

Example
<ul>
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ul>

Ordered HTML List


An ordered list starts with the <ol> tag. Each list item starts with the <li> tag.

Example
<ol>
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ol>
Ordered HTML List - The Type Attribute
type="1" numbers 
type="A" uppercase letters
type="a" lowercase letters
type="I" uppercase roman numbers
type="i" lowercase roman numbers
Example
<ol type="1">
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ol>
Defining an HTML Table
An HTML table is defined with the <table> tag.

Each table row is defined with the <tr> tag. A table header is defined with the <th> tag. By
default, table headings are bold and centered. A table data/cell is defined with the <td> tag.

<table border=”2”>

<tr>

<th>Firstname</th>

<th>Lastname</th>

<th>Age</th>

</tr>

<tr>

<td>Jill</td>

<td>Smith</td>

<td>50</td>

</tr>

<tr>

<td>Eve</td>

<td>Jackson</td>

<td>94</td>

</tr>

</table>

HTML Table - Cells that Span Many Columns


To make a cell span more than one column, use the colspan attribute:

<table style="width:100%">

<tr>

<th>Name</th>

<th colspan="2">Telephone</th>

</tr>

<tr>

<td>Bill Gates</td>

<td>55577854</td>

<td>55577855</td>

</tr>

</table>

HTML Table - Cells that Span Many Rows


To make a cell span more than one row, use the rowspan attribute:

<table style="width:100%">

<tr>

<th>Name:</th>

<td>Bill Gates</td>

</tr>

<tr>

<th rowspan="2">Telephone:</th>

<td>55577854</td>

</tr>

<tr>

<td>55577855</td>
</tr>

</table>

HTML Table - Adding a Caption


To add a caption to a table, use the <caption> tag:

<table style="width:100%">

<caption>Monthly savings</caption>

<tr>

<th>Month</th>

<th>Savings</th>

</tr>

<tr>

<td>January</td>

<td>$100</td>

</tr>

<tr>

<td>February</td>

<td>$50</td>

</tr>

</table>

You might also like