Using HTML Basics

HTML is used to display web pages and other information that can be read from a web browser. You may decide to use HTML in your ads to enhance their display on marketplaces. The information that follows is very basic but will allow you to get started. You can find a wealth of information about HTML on the web..

What is HTML?

HTML is a language for describing web pages.

HTML stands for H yper T ext M arkup L anguage
HTML is not a programming language, it is a markup language
A markup language is a set of markup tags
HTML uses markup tags to describe web pages

HTML Tags

HTML markup tags are usually called HTML tags

HTML tags are keywords surrounded by angle brackets like <html>
HTML tags normally come in pairs like <b> and </b>
The first tag in a pair is the start tag, the second tag is the end tag
Start and end tags are also called opening tags and closing tags .

HTML Paragraphs and Formatting

Paragraphs are defined with the </p> tag.

                        <p>This is a paragraph</p> <p>This is another paragraph</p>

Use the <br> tag if you want a line break (a new line) without starting a new paragraph.

Text Formatting Tags

Tags are used to format text. Here is a list of tags and their descriptions.

Tag	Description
<b>	Defines bold text
<big>	Defines big text
<em>	Defines emphasized text
<i>	Defines italic text
<small>	Defines small text
<strong>	Defines strong text
<sub>	Defines subscripted text
<sup>	Defines superscripted text
<ins>	Defines inserted text
<del>	Defines deleted text

HTML Styles

The purpose of the style attribute is to provide a common way to style all HTML elements.

style="background-color:yellow"
style="font-size:10px"
style="font-family:Times"
style="text-align:center"

HTML Style Examples

Background Color: <body style="background-color:yellow">

                        <html> <body style="background-color:yellow"> <h2>Look: Colored Background!</h2> </body> </html>

Font Family, Color and Size: <p style="font-family:courier new; color:red; font-size:20px">

                        <html> <body style="background-color:yellow"> <h1 style="font-family:verdana">A heading</h1> <p
                        style="font-family:courier new; color:red; font-size:20px;">A paragraph goes here</p> </body> </html>

Text Alignment: <h1 style="text-align:center">

                        <html> <body style="background-color:yellow"> <h1 style="text-align:center">This is heading 1</h1>
                        <p>The heading above is aligned to the center of this page. The heading above is aligned to the center of this page.
                        The heading above is aligned to the center of this page.</p> </body> </html>

HTML Links

A link is the address to a document or resource on the web. A hyperlink can point to any resource on the web: an HTML page, an image, a sound file, etc.

                        <a href="http://www.ChannelAdvisor.com/"target="_blank">ChannelAdvisor Homepage</a>

How it looks in a browser:

ChannelAdvisor Homepage

HTML Images

In HTML, images are defined with the <img> tag. The <img> tag is empty, which means that it contains attributes only and it has no closing tag.

To display an image on a page, you need to use the src attribute. Src stands for "source". The value of the src attribute is the URL of the image you want todisplay on your page. The syntax of defining an image:

                        <img src="url">

The URL points to the location where the image is stored. An image named "ca_logo.gif" located in the directory "images" on "www.ChannelAdvisor.com" has the URL: http://www.ChannelAdvisor.com/images/ca_logo.jpg.

The browser puts the image where the image tag occurs in the document. If you put an image tag between two paragraphs, the browser shows the first paragraph, then the image, and then the second paragraph.

HTML Tables

Tables are defined with the <table> tag. A table is divided into rows (with the <tr> tag), and each row is divided into data cells (with the <td> tag). The letters td stands for "table data," which is the content of a data cell. A data cell can contain text, images, lists, paragraphs, forms, horizontal rules, tables, etc.

                        <table border="1"> <tr> <th>Heading</th> <th>Another Heading</th> </tr> <tr>
                        <td>row 1, cell 1</td> <td>row 1, cell 2</td> </tr> <tr> <td>row 2, cell 1</td>
                        <td>row 2, cell 2</td> </tr> </table>

How it looks in a browser:

Heading	Another Heading
row 1, cell 1	row 1, cell 2
row 2, cell 1	row 2, cell 2

HTML Lists and Bullets

What is HTML?

HTML is a language for describing web pages.

HTML stands for H yper T ext M arkup L anguage
HTML is not a programming language, it is a markup language
A markup language is a set of markup tags
HTML uses markup tags to describe web pages

HTML Tags

HTML markup tags are usually called HTML tags

HTML tags are keywords surrounded by angle brackets like <html>
HTML tags normally come in pairs like <b> and </b>
The first tag in a pair is the start tag, the second tag is the end tag
Start and end tags are also called opening tags and closing tags .

HTML Paragraphs and Formatting

Paragraphs are defined with the </p> tag.

                        <p>This is a paragraph</p> <p>This is another paragraph</p>

Use the <br> tag if you want a line break (a new line) without starting a new paragraph.

Text Formatting Tags

Tags are used to format text. Here is a list of tags and their descriptions.

Tag	Description
<b>	Defines bold text
<big>	Defines big text
<em>	Defines emphasized text
<i>	Defines italic text
<small>	Defines small text
<strong>	Defines strong text
<sub>	Defines subscripted text
<sup>	Defines superscripted text
<ins>	Defines inserted text
<del>	Defines deleted text

HTML Styles

The purpose of the style attribute is to provide a common way to style all HTML elements.

style="background-color:yellow"
style="font-size:10px"
style="font-family:Times"
style="text-align:center"

HTML Style Examples

Background Color: <body style="background-color:yellow">

                        <html> <body style="background-color:yellow"> <h2>Look: Colored Background!</h2> </body> </html>

Font Family, Color and Size: <p style="font-family:courier new; color:red; font-size:20px">

                        <html> <body style="background-color:yellow"> <h1 style="font-family:verdana">A heading</h1> <p
                        style="font-family:courier new; color:red; font-size:20px;">A paragraph goes here</p> </body> </html>

Text Alignment: <h1 style="text-align:center">

                        <html> <body style="background-color:yellow"> <h1 style="text-align:center">This is heading 1</h1>
                        <p>The heading above is aligned to the center of this page. The heading above is aligned to the center of this page.
                        The heading above is aligned to the center of this page.</p> </body> </html>

HTML Links

A link is the address to a document or resource on the web. A hyperlink can point to any resource on the web: an HTML page, an image, a sound file, etc.

                        <a href="http://www.ChannelAdvisor.com/"target="_blank">ChannelAdvisor Homepage</a>

How it looks in a browser:

ChannelAdvisor Homepage

HTML Images

In HTML, images are defined with the <img> tag. The <img> tag is empty, which means that it contains attributes only and it has no closing tag.

                        <img src="url">

HTML Tables

                        <table border="1"> <tr> <th>Heading</th> <th>Another Heading</th> </tr> <tr>
                        <td>row 1, cell 1</td> <td>row 1, cell 2</td> </tr> <tr> <td>row 2, cell 1</td>
                        <td>row 2, cell 2</td> </tr> </table>

How it looks in a browser:

Heading	Another Heading
row 1, cell 1	row 1, cell 2
row 2, cell 1	row 2, cell 2

HTML Lists and Bullets

Your rating:

Your rating: None Average: 3 (2 votes)

Related Topics:

Your rating:

Your rating: None Average: 3 (2 votes)

Page last updated: Tue, 09/25/2012 - 11:04

ChannelAdvisor Strategy and Support Center

How To

Using HTML Basics

What is HTML?

HTML Tags

HTML Paragraphs and Formatting

Text Formatting Tags

HTML Styles

HTML Style Examples

HTML Links

HTML Images

HTML Tables

HTML Lists and Bullets

What is HTML?

HTML Tags

HTML Paragraphs and Formatting

Text Formatting Tags

HTML Styles

HTML Style Examples

HTML Links

HTML Images

HTML Tables

HTML Lists and Bullets

Tags