What is HTML?
HTML (Hypertext Markup Language) is a language understood by your web browser, like Internet Explorer or Netscape Navigator. All the documents available on the World Wide Web are written in HTML, which runs on any type of computer having a web browser. It has a collection of styles (indicated by tags) that define the various components of a World Wide Web document. An HTML document can be opened in any operating system or on any hardware, such as a PC, Macintosh, or UNIX-operated machine.
Basic Structure of HTML
HTML stands for Hypertext Markup Language and is the basic structural element that is used to create web pages.
An HTML page consists of the following tags:
- <!DOCTYPE>: A DOCTYPE declaration must be specified in the first line of each web document.
- <HTML>: This tag specifies the document as an HTML document.
- <HEAD>: This tag contains information about the document, including its title, scripts used, style definitions, and document descriptions.
- <TITLE>: This tag contains the document title. The title specified inside the <Title> tag appears on the browser’s title bar. You should be very careful while choosing the title because a title is also used to identify a web page for search engines.
- <BODY>: This forms the largest part of the HTML document. The <Body> tag encloses all the tags, attributes, and information to be displayed on the web page. The information written in the body tag is displayed in the browser window.
The following example shows the tags that make up the standard skeleton of an HTML document:
<!DOCTYPE>
<HTML>
<HEAD>
<TITLE>Document Title</TITLE>
</HEAD>
<BODY>
Contents of Document
</Body>
</Html>Formatting Tags
HTML formatting tags such as <b>,<i>,<u>,<strike> etc., are used to make some text on your web pages appear different than normal text.
- Bold: The bold tag <b> </b> bolds the text you want to highlight.
- Strong: The strong tag <strong> </strong> bolds the text you want to highlight.
- Italic: The italic tag <i> </i> makes the text you want to display in italic face style.
- Emphasis: The emphasis tag <em> </em> makes the text you want to display in italic face style.
- Underline: The tag <u> </u> underlines the text you want to display.
- Inserted: The tag <ins> </ins> underlines the text you want to display.
- Strikethrough: The tag <s> </s> strikes out the text. The content of strikethrough tags would appear with a horizontal line over the text.
- Deleted: The tag <del> </del> strikes out the text. The content of deleted tags would appear with a horizontal line over the text.
- Marked Text: The tag <mark> </mark> highlights the text with a yellow background by default.
- Small: The tag <small> </small> reduces the font size of the text.
HTML Lists
A list is a record of information, such as names of students, usually written on each line and ordered in a way that makes a particular thing easy to find.
There are three different types of HTML lists:
- Ordered List or Numbered List: An ordered list is a list with numbers in an order ascending or descending. The author prefixes each item with a number. The tags used for this time are <ol> </ol>. The browser applies the appropriate number to each line when it opens the page.
- Unordered List or Bulleted List: This is an unordered list. The author prefers each item with a bullet. The tags used for this are <ul> </ul>.
- Definition List or Description List: The definition list is created with the <dl> element and usually consists of a series of terms and their definitions. Inside the <dl> element, you will usually see pairs of <dt> </dt> and <dd> </dd> elements.
HTML Tables
HTML tables are contained within a TABLE element. The TABLE element denotes the range of the table and uses attributes to define properties of it. For example, the BORDER attribute indicates the size of the border to draw around the table and between each of the table’s cells. We call each box within the table a cell. There are several other attributes besides BORDER.
Attributes of Table:
- Align: To align the table, the ALIGN attribute <TABLE> tag may be used. This can have values left, right, and center, indicating where the table should be placed.
- Table Border Color: The BORDERCOLOR attribute is used to specify the color of the table’s border. The attribute of BORDERCOLOR is BORDERCOLOR=”colorname.”
- Cellspacing and Cellpadding: To control the spacing in cells, use the CELLSPACING and CELLPADDING attributes. Cellpadding refers to the inner margins of free space that each cell of a table has as its padded border. On the other hand, cellspacing refers to how space is left between each cell wall in a table.
- Table Height and Width: You can also set the table’s height and width in terms of pixels and percentage of browser window. For instance, to set the width to 50% and the height to 40% of the margins.
