HTML codes for Ebay

HTML is a markup language used for creating complete web pages for web sites however with ebay on-line auctions the HTML is used to create part of a web page which will only be active for a few days. Most HTML tags come in pairs, a start tag and an end tag, with the content placed between them.
There are many HTML tags that may be used in many different ways, here are some which are useful for ebay purposes with examples of what can be done.

HTML coding for text

<p> </p> Denotes the beginning and ending of a paragraph. In ebay listings these are used for long passages of text.

• align="left" This attribute aligns paragraph text on the left.
• align="right" This attribute aligns paragraph text on the right.
• align="justify" This attribute aligns paragraph text left and right.

<font> </font> These are used to give text style. For ebay auctions the most common uses are for colour, font type and size. Note that the font face will only display if the end user has the font on their PC.

The font may be given a style or face. There are many font types available however the font type does need to be installed on a PC for it to display. There are only a few font types that are common to most PC's and these are;

Information: The font tag is an older type of HTML code which is gradually going out of general use but is still popular for Ebay template designs.

Example of coding;
<font color="#ff1493" face="Comic Sans MS" size="5"> </font>

<br /> or <br> This is the line break, used in text to start a new line. Also used for creating vertical spacing between elements in an auction listing.

• <b> </b> Denotes the start and end of bold text.
• <u> </u> Denotes the start and end of underlined text.
• <s> </s> Denotes the start and end of strike through text.
• <i> </i> Denotes the start and end of italicised text.
• <span> </span> Span gives text style without affecting it's formatting.

Heading tags

<h1> </h1> through to <h6> </h6>

There are six pair of tags used for headings, these rank in importance from <h1> down to <h6>. The size of the heading text is relative to to main text size, <h1> is the largest decreasing to the smallest <h6>. For auction listing the most useful are <h1> which can be used for the auction listing title, <h2> and <h3> which can be used for sub headings. Attributes or styles codes can be applied to header tags to stylise their appearance. Examples are shown below.

Coding for images

This is the basic code for embedding an image;
<img src="http://www.yourimagehoster.com/yourimage.jpg" />

The image can be positioned in the page using the following attributes;

• align="left" This attribute places the image on the left and the text will flow around it.
• align="right" This attribute places the image on the right and the text will flow around it.
• vspace="10" This attribute creates a space of 10 pixels top and bottom of image.
• hspace="10" This attribute creates a space of 10 pixels left and right of image.

A decorative border can be added to an image by using style codes to select colour, size and style. The code for doing this is shown below.

The centre tag

<center> </center> The centre tags are used to centre text or objects horizontally in the auction listing. Although many HTML tags have centre align ability using the centre tags is a quick and effective method for ebay auctions. Any coding placed between the centre tags will then be displayed centred.

Lists

Sometimes it may be necessary to have a list of items, this can done done using HTML list codes. There are two types of lists; unordered, where each item has a bullet point and ordered lists where each item is numbered.

• <ul> </ul> Denotes the start and end of an unordered list containing list items.
• <ol> </ol> Denotes the start and end of an ordered list containing list items.
• <li> </li> Denotes the start and end of a list item.

This is an example of an unordered list.

This is an example of an ordered list.

Tables

HTML tables are good at producing a structured form. They can be used to produced the layout of an auction listing or for positioning multiple photographs within a listing. Using tables for an ebay auction listing is a simple way of creating a good looking auction.

• <table> </table> denotes the start and end of a table.
• <tr> </tr> denotes the start and end of a row.
• <td> </td> denotes the start and end of a data cell, all content is placed between these.

Attributes can be used to give the table structure. These are applied to the start tag, <table>.

• border This applies a border around the cells, set to zero gives no border.
• cellspacing This sets the space around the outside of each cell.
• cellpadding This sets the space around the cell content and expands the cell size.

Other attributes can be applied to the table tag, <table>, and also the data cell tag, <td>.

• width="50%" This sets the width and can be set in pixels or as a percentage.
• bgcolor="#fafad2" This sets the background colour.
• background="http://www.yourimagehoster.com/yourimage.gif" This sets an image as the background. The image needs to be hosted by an image hoster such as Photobucket.
• align="center" This centres the table horizontally.

Shown below is the coding for a basic table with the result beneath.

The data cells can be made to stretch across multiple cells using colspan , as shown below with the result beneath;

The data cells can be made to stretch across multiple rows using rowspan , as shown below with the result beneath;