What are HTML tags?
HTML Tags are tags within a web page which is surrounded by angle brackets that tells the browser how the web pages should be displayed. Many of tags come in pairs like <p> and </p> The first tag in pairs is start tag and second closing tag is the end tag. The end tag is same as start tag but with a forward slash, now question is do all HTML tags come in pair ?
No there are so many tags that does not need for closing. Examples are given below :
<img> tag and <br> tags.
The <html> tag is a root of an HTML document which contains all HTML elements.
| Tag | Description |
|---|---|
| <!DOCTYPE> | Defines the document type which means pages is written in HTML 5 |
| <html> | Defines root of an HTML document |
| <title> | Defines a title for the web pages |
| <body> | Defines the body area |
| <h1> to <h6> | Defines headings tags for text |
| <p> | Defines a paragraph |
| <br> | Defines a single line break |
| <!--...--> | Defines a comment that will not display in browser |
Tags which is mostly used in form
| Tag | Description |
|---|---|
| <form> | Defines an HTML form opening tag for user input |
| <input> | Defines an input tag |
| <textarea> | Defines a text area for multiline input control |
| <button> | Defines a button to click or submit form |
| <select> | Defines a drop-down tags to show list of element in select box |
| <optgroup> | Defines a group of options in a select box |
| <option> | Defines an option in a select box |
| <label> | Defines a label for an <input> element |
| <fieldset> | Grouping for html elements in a form |
Common/Basic Tags
| Tag | Description |
|---|---|
| <img> | Defines an image |
| <a> | Create a hyperlink to load url |
| <ul> | Defines a list which is in unordered format |
| <ol> | Defines a list which is in ordered format |
| <li> | Defines a item for list |
| <table> | Defines a tag for table |
| <caption> | Defines a caption for a table |
| <th> | Defines a column text in bold format in a table |
| <tr> | Defines a row for a table |
| <td> | Defines a column in a table |
| <head> | Defines head tags about the document |
| <style> | Defines a tag for styling for a document |
| <script> | Defines a tag for client side script |
<marquee> tags is used for scrolling text or images in many format either vertically or horizontally with lots of settings.
The <h1> to <h6> tags are used for headings.<h1> defines the most important heading. <h6> defines the least important heading.
Examples of above tags :1st Example :
- <!DOCTYPE html>
- <html>
- <head>
- <title>Example of Heading Tags</title>
- </head>
- <body>
- <h1>This is example of heading 1</h1>
- <h2>This is example of heading 2</h2>
- <h3>This is example of heading 3</h3>
- <h4>This is example of heading 4</h4>
- <h5>This is example of heading 5</h5>
- <h6>This is example of heading 6</h6>
- </body>
- </html>
2nd Example :
- <!DOCTYPE html>
- <html>
- <head>
- <title>Example for Paragraph Tag</title>
- </head>
- <body>
- <p>This is a test for first paragraph.</p>
- <p>This is a test for second paragraph.</p>
- <p>This is a test for third paragraph.</p>
- </body>
- </html>
3rd Example :
- <!DOCTYPE html>
- <html>
- <head>
- <title>Example for Unordered List</title>
- </head>
- <body>
- <ul>
- <li>expertphp</li>
- <li>demo.expertphp</li>
- </ul>
- </body>
- </html>
Attribute of Unordered list are :
- <ul type="square">
- <ul type="disc">
- <ul type="circle">
4th Example :
- <!DOCTYPE html>
- <html>
- <head>
- <title>Example for Ordered List</title>
- </head>
- <body>
- <ol>
- <li>expertphp</li>
- <li>demo.expertphp</li>
- </ol>
- </body>
- </html>
Attribute of Ordered list are :
- <ol type="1"> - Default as Number.
- <ol type="I"> - Upper-Case Numerals.
- <ol type="i"> - Lower-Case Numerals.
- <ol type="a"> - Lower-Case Letters.
- <ol type="A"> - Upper-Case Letters.
