Creating Table in HTML

In an HTML (Hypertext Markup Language) document, a table is a structured element used to organize and display data in rows and columns. It allows you to present information in a tabular format, such as displaying lists of items, data tables, or charts. To define a table in an HTML document, you use the <table> element.

<Table>……………………………….</Table>
In HTML we can create table using <table> tag. Table being with <table> tag and end with </table> tag. Between <table> tag there are rows that are enclosed between<tr> and </tr> tag. In side these rows there are cells which are enclosed between <td> tag.

Attributes of <table > tag

Border=value ( It defines the size of the border around the table.)

Bgcolor=color name or value (it is used to define background color of a table.)

Background=“image path” ( suggests a background image for a table.)

Width=value (Defines width of a table as a whole.)

Height=value ( Defines height of  a table as a whole.)

Align=left|Right|center (Suggests the alignment of the table.)

Bordercolor=color name or value (It defines the color of the border around the table.)

Cellspacing= Value ( It is used to define space between cells in pixels.)

Cellpadding=value (It defines the space between cell border and content in pixels.)

<Tr>……………………………….</Tr>

This tag is used to create row in a table.

Attributes of <tr> tag

Align=left|Right|center ( Suggests the alignment of the text in a table row.)

Bgcolor=color name or value ( It is used to define background color of a table row.)

Background=“image path” ( suggests a background image for a table row.)

Bordercolor=color name or value ( It defines the color of the border around the table row.)

<Th>……………………………….</Th>

This tag is used to create row heading of a table data.

<Caption>………………………………. </caption>

This tag is used to give the caption of the table.

<Td>……………………………….  </Td>

It is used to define data inside each table cell.

Attributes of <td> tag

Align=left|Right|center (Suggests the alignment of the text in a table cell)

Bgcolor=color name or value ( It is used to define background color of a table cell.)

Valign=Top|Bottom|middle (suggests vertical alignment of a text in a table cell.)

Bordercolor=color name or value ( It defines the color of the border around the table cell.)

Width=value ( Defines the width of a table cell)

Height=value ( It helps user to define cell height.)

Colspan=value (Defines how many columns to cover/merge in a cell)

Rowspan=value (Defines how many rows to cover/merge in a cell)

Creating Form In HTML Document

<form>……………………………….</form>

In an HTML (Hypertext Markup Language) document, a form is an element that allows users to input data and interact with a webpage. Forms are commonly used for submitting data to a server for processing, such as submitting a contact form or creating an account. To define a form in an HTML document, you use the <form> element.

Attributes of <form> tag

Name=name of a form (Suggests the name of a form)

Action=“URL” (Defines the URL(database path) of the web server. In another word it specify the address to be carryout the action of the form.)

Method=Get|post (Defines how the form data to be  send to web server.) Get method is used to send small amount of data and Post method is Used to send large amount of data. In this method data are send in hidden form.

Creating Form element in HTML

<input>

This tag is used to create textbox, radio button, checkbox, password box, reset button, submit button etc in a webpage.

Attributes of <input> tag

Type=text|Checkbox|Radio|password|submit|reset|button|file|Image ( Use to define a type of button or textboxes in a webpage. )

  • Type=text   (Creates a single line text field/text box to input data from user.)
  • Type=checkbox (Use to create check box in a web page.)
  • Type=radio  (Used to create radio button similar to check box but radio button are set in a group with same name given to each button. Only one button in a group can be on at a one time.)
  • Type=password (Creates a password box)
  • Type=submit (Use this button to submit a form data in a database.)
  • Type =reset (Used to create reset button which is used to clear all fields of the form.)
  • Type=button (This type create a button in a webpage.)
  • Type=file (Creates a browse button in a webpage.)
  • Type=image (Use this type to create image button. Attributes of this type are src, alt, width and height.)

Name=“name of a input type” (Suggests the name of a input type .)

Value=“Text string” ( Gives the value of a given input type)

Size=value (Defines the size of a given input type)

Maxlength=value (Use this attribute to define maximum length of the text box.)

Accesskey=“shortcut key for the text box” (Specifics a single character as shortcut key for a text boxes.)

 <Textarea>…………………………</Textarea>

This tag is used to define a textarea in a webpage. In another word it is useful to create a textbox for multi line text typing.

Attributes of <textarea> tag

Name=“name of a text area” (Suggests the name of a text area)

Cols=value (Gives the column value of a given text area)

Rows=value (Defines the size of row of a given text area)

<Select>………………………….</select>

<select> tag is used to create selection list in a webpage. A selection list is a set of text or records in which user can select each record at a time. In select tag we use <option> tag to add item in a selection list box.

<option>………………………….</option>

This tag is used to define item in a selection list box.

<Fieldset>………………………….</Fieldset>

It is used to group related elements in a webpage. In field set tad we use <legend> tag to described enclosed item.

<legend>……………………………….</legend>

The <legend> tag defines a caption for form controls grouped by the FIELDSET element. The LE- GEND element must be at the start of a FIELDSET, before any other elements.

Attributes of <legend> tag

Align=left|center|Right (Gives the alignment of a legend of a field set)

Read More on Part -V

SHARE

LEAVE A REPLY

Please enter your comment!
Please enter your name here

*