Deatails and Summary HTML Tag

The <summary> tag used to add to a visible heading of the <details> tag. The heading is clickable to view/hide the details. The <summary> tag is new in HTML5 and it has opening and closing ends.The <summary> tag should be the first child tag for the <details> tag or we can say that <summary> tag should put as first tag inside <details> tag,So we assume that <summary> tag and <details> tag are family tag.
<details> tag is the wrapper for all the content we want to show or hide, and <summary> contains summary and Heading of the section.
The open attribute is by default and there is no closed attribute for <details> tag.
Generally when we want to make a interactive widget that provides a way of hide and show of our content,it require a long javascript coding but by using HTML5 <details> and <summary> tags we can create this toggle feature with just a few lines of HTML and without any JavaScript.So these HTML5 tags make webpage attractive and provide a way to save space in webpage.
Inside <details>, we can put any type of content taht we want.


You can understand use of <details> and <summary> tags by a simple example:-

e.g.

<!DOCTYPE html>
<html>
<head>
<title>Deatails tag< and <Summary>/title>
</head>
<body>

<details>
<summary>Show/Hide</sumary>
<p>Indianwebschool is india's leading web development learning portal .</p>
</details>

<details>
<summary>How To Start Blogging Learn by Blogger Video(please click here)</summary>
<p>Blogger Getting Started Guide by Google </p>
<iframe width="560" height="315" src="//www.youtube.com/embed/NXx4zbid45Q"></iframe>
</details>

<details>
<summary>indianwebschool</summary>
<p> Designed by Ndal Gurjar. All Rights Reserved.</p>
<p>All content and graphics on this web site are the property of the company indianwebschool.</p>
</details>

</body>
</html>


Result:-
Show/Hide

Indianwebschool is india's leading web development learning portal .



How To Start Blogging Learn by Blogger Video(please click here)

Blogger Getting Started Guide



indianwebschool

Designed by Ndal Gurjar. All Rights Reserved.

All content and graphics on this web site are the property of the company indianwebschool.



e.g.2

<!DOCTYPE html>
<html>
<head>
<title>Deatails tag< and <Summary>/title>
</head>
<body>
<details>
<summary>Sections</summary>
<p><strong>The body tag</strong></p>
<p><strong>The airticle tag</strong></p>
<p><strong>The section tag</strong></p>
<p><strong>The nav tag</strong></p>
<details>
<summary>Related documents</summary>
<ul>
<li><p><strong>The aside tag</strong></p></li>
<li><p><strong>The h1,h2,h3,h4,h5,h6 tag</strong></p></li>
<li><p><strong>The header tag</strong></p></li>
<li><p><strong>The footer tag</strong></p></li>
<li><p><strong>The address tag</strong></p></li>
</ul>
</details>
</details>
</body>
</html>


Result:-
Sections

The body tag

The airticle tag

The section tag

The nav tag

Related documents

  • The aside tag

  • The h1,h2,h3,h4,h5,h6 tag

  • The header tag

  • The footer tag

  • The address tag





Read More

sup and sub HTML tags

The <sup> tag is used to define superscript text in an HTML webpage while <sub> tag is used to define subscript text.
A subscript or superscript may a number, figure, fable(symbol), or indicator that is smaller than the stated parentage text (normal text).Subscripts appear under the baseline, even if superscripts are above.

Subscripts and superscripts are generally used in mathematical expressions and in languages.just like we want to add 3 power of 2 then we use supscript. <sub> tag for defining subscript text.

Superscript text can be used for footnotes, like Indianwebschool is india's leading web development learning portal[1].You can see it's example at wikipedia where it is used to show reference no.


You can understand use of <sup> and <sub> tags by a this example:-

e.g.

<!DOCTYPE html>
<html>
<head>
<title>sup tag< and <sub>/title>
</head>
<body>
<p>
This is superscripted<sup>text</sup> </p>
<p>
This is subscripted<sub>text</sub> </p>
</body>
</html>


Result:-

This is superscriptedtext

.

This is subscriptedtext

.


e.g.2

<!DOCTYPE html>
<html>
<head>
<title>sup tag< and <sub>/title>
</head>
<body>
<p>
2<sup>4</sup>=16
P<sup>x</sup>
</p>
</body>
</html>


Result:-

24 = 16
Px.



Read More

Table Tag HTML

The <table> tag is used to add an HTML table in webpage. The <table> tag is used in conjunction with the <tbody>,<thead> and <tfoot> tags in the table tag to specify each part of a table (header, body, footer).
The <table> tag have one or more <tr> and <td> tags inside <tbody>,<thead> and <tfoot> tags.It is an HTML5 tag.It has also opening and closing tags.It has boder attribute to define border of table.Two attribiutes cellpadding and cellspacing which can use to adjust the white space in your table cell. Cellspacing defines the width of the border, while cellpadding specifies the distance between cell borders and the content within. (valid in blogger.)

Optional Attributes for <table> tag :- align|width|summary|sortable|rules|frame|cellpadding|border|bgcolor
These attributes are not supported in HTML5 but valid in older version.


You can understand use of <table> tag by a simple example:-

e.g.1

<!DOCTYPE html>
<html>
<head>
<title>use of Table tag</title>
</head>
<body>

<table border="1">

<thead>
<tr>
<th>Header 1</th>
<th>Header 2</th>
<th>Header 3</th>
</tr>
</thead>

<tfoot>
<td colspan="3">footer1</td>
</tfoot>

<tbody>
<tr>
<td>Cell 1</td>
<td>Cell 2</td>
<td>Cell 3</td>
</tr>
<tr>
<td>Cell 4</td>
<td>Cell 5</td>
<td>Cell 6</td>
</tr>
</tbody>

</table>
</body> </html>


Result:-
Header 1 Header 2 Header 3
footer1
Cell 1 Cell 2 Cell 3
Cell 4 Cell 5 Cell 6
Cell1-cell6 includes in table body,Header1-header6 includes table header and footer1 is include in table footer.In table footer we use colspan that is use to merge columns.

e.g.2

<!DOCTYPE html>
<html>
<head>
<title>use of Table tag</title>
</head>
<body>

<table border="1">

<thead>
<tr> <tH>Weekday</tH> <tH>date</tH>
<tH>Manager</tH> </tr>
</thead>

<tbody>
<tr> <td>Monday</td> <td>04/06/2015</td> <td>Amit</td> </tr>
<tr> <td>tuesday</td> <td>04/07/2015</td> <td>rina</td> </tr>
<tr> <td>Wednesday</td> <td>04/08/2015</td> <td>Akshay</td> </tr>
<tr> <td>thursday</td> <td>04/09/2015</td> <td>Sunil</td> </tr>
<tr> <td>Friday</td> <td>04/10/2015</td> <td>rahul</td> </tr>
<tr> <td>Saturday</td> <td>04/11/2015</td> <td>Lokesh</td> </tr>
<tr> <td>Sunday</td> <td>04/12/2015</td> <td>Suman</td> </tr>
</tbody>

</table>
 </body>
</html>


Result:-
Weekday date Manager
Monday 04/06/2015 Amit
tuesday 04/07/2015 rina
Wednesday 04/08/2015 Akshay
thursday 04/09/2015 Sunil
Friday 04/10/2015 rahul
Saturday 04/11/2015 Lokesh
Sunday 04/12/2015 Suman




Conclusion:-- So the <table> tag is used to add an HTML table.It is important tag that used for arranging data in rows and columns in a webpage.


Read More

tbody tag

The <tbody> tag is used to add a body to an HTML table. The <tbody> element is used in conjunction with the <thead> and <tfoot> tags in the table tag to specify each part of a table (header, body, footer).The <tbody> tag have one or more<tr> and <td> tags inside.It is an HTML5 tag.It has also opening and closing tags.

Optional Attributes for <tbody> tag :- align|valign|char|charoff
These attributes are not supported in HTML5.
align=left| center|right|justify|char ---- (horizontal alignment of cells in group)
char=Character---- (alignment character for cells)
charoff=Length ----(alignment character offset)
valign= top|middle|bottom|baseline---- (vertical alignment of cells in group)

You can understand use of <tbody> tag by a simple example:-

e.g.1

<!DOCTYPE html>
<html>
<head>
<title>use of tbody tag</title>
</head>
<body>
<table border="1" width="100%" align="center">

<thead>
<tr>
<th>Header 1</th>
<th>Header 2</th>
<th>Header 3</th>
</tr>
</thead>

<tfoot>
<td colspan="3">footer1</td>
</tfoot>

<tbody>
<tr>
<td>Cell 1</td>
<td>Cell 2</td>
<td>Cell 3</td>
</tr>
<tr>
<td>Cell 4</td>
<td>Cell 5</td>
<td>Cell 6</td>
</tr>
</tbody>

</table>
</body> </html>


Result:-
Header 1 Header 2 Header 3
footer1
Cell 1 Cell 2 Cell 3
Cell 4 Cell 5 Cell 6
Cell1-cell6 includes in table body,Header1-header6 includes table header and footer1 is include in table footer.In table footer we use colspan that is use to merge columns.

e.g.2

<!DOCTYPE html>
<html>
<head>
<title>use of tbody tag</title>
</head>
<body>
<table border="1" width="100%">

<thead>
<tr> <tH>Weekday</tH> <tH>date</tH>
<tH>Manager</tH> </tr>
</thead>

<tbody>
<tr> <td>Monday</td> <td>04/06/2015</td> <td>Amit</td> </tr>
<tr> <td>tuesday</td> <td>04/07/2015</td> <td>rina</td> </tr>
<tr> <td>Wednesday</td> <td>04/08/2015</td> <td>Akshay</td> </tr>
<tr> <td>thursday</td> <td>04/09/2015</td> <td>Sunil</td> </tr>
<tr> <td>Friday</td> <td>04/10/2015</td> <td>rahul</td> </tr>
<tr> <td>Saturday</td> <td>04/11/2015</td> <td>Lokesh</td> </tr>
<tr> <td>Sunday</td> <td>04/12/2015</td> <td>Suman</td> </tr>
</tbody>

</table>
</body>
</html>


Result:-
Weekday date Manager
Monday 04/06/2015 Amit
tuesday 04/07/2015 rina
Wednesday 04/08/2015 Akshay
thursday 04/09/2015 Sunil
Friday 04/10/2015 rahul
Saturday 04/11/2015 Lokesh
Sunday 04/12/2015 Suman




Conclusion:-- So the <tbody> tag is used to add a body to an HTML table.tr and td tags are child tag for tbody tag.It is important section for designing a table in a webpage.



Read More

<td> tag

The <td> tag is used to define a standard cell in an HTML table in a webpage.The text in <td> tags are regular and left-aligned by default.<td> tag is an HTML5 tag.It has also opening and closing ends.

Optional Attributes of <td> tag :- align|Axis|charoff|valign|bgcolor|char
Thesee attributes are not valid in HTML5 but in earlier version these are valid.


You can understand use of <td> tag by a simple example:-

e.g.1

<!DOCTYPE html>
<html>
<head>
<title>use of td tag</title>
</head>
<body>
<table border="1">
<tr>
<th>Name</th> <th>month</th> <th>Income</th>
</tr>
<tr>
<td>Rakesh</td> <td>January</td> <td>15000/-Rs.</td>
</tr>
<tr>
<td>Ram</td> <td>January</td> <td>12000/-RS.</td>
</tr>
</table>
</body> </html>


Result:-
Name month Income
Rakesh January 15000/-Rs.
Ram January 12000/-Rs.


e.g.2

There are two attribiutes cellpadding and cellspacing which can use to adjust the white space in your table cell. Cellspacing defines the width of the border, while cellpadding specifies the distance between cell borders and the content within.

<!DOCTYPE html>
<html>
<head>
<title>use of td tag</title>
</head>
<body>
<table border="1" cellpadding="16">
<tr>
<th>Month</th> <th>Savings</th>
</tr>
<tr>
<td>January</td> <td>$100</td>
</tr>
</table>
</body>
</html>


Result:-
Month Savings
January $100


e.g.2.1

<!DOCTYPE html>
<html>
<head>
<title>use of td tag</title>
</head>
<body>
<table border="1" cellpadding="16" cellspacing="5">
<tr>
<th>Month</th> <th>Savings</th>
</tr>
<tr>
<td>January</td> <td>$100</td>
</tr>
</table>
</body>
</html>


Result:-
Month Savings
January $100




Conclusion:--

So the <td> tag is used to define a row in an HTML table in a webpage.<td> and <th> tags are important for table designing in webpage.



Read More

<tr> tag

The <tr> tag is used to define a row in an HTML table in a webpage.The <tr> tag contains one or more <th> or <td> tags.These three grouping tags: headers (thead tag), bodies (tbody tag) and footers (tfoot tag) contain rows.It is an HTML5 tag.It has opening and closing tags.

Optional Attributes of <tr> tag :- ALIGN/HALIGN|VALIGN|BGCOLOR
Thesee attributes are not valid in HTML5 but in earlier version these are valid.
ALIGN/HALIGN: horizontal alignment of cell contents
VALIGN: vertical alignment of cell contents
BGCOLOR: background color.

You can understand use of <tr> tag by a simple example:-

e.g.1

<!DOCTYPE html>
<html>
<head>
<title>use of <tr> tag</title>
</head>
<body>
<table border="1">
<tr>
<th>Name</th> <th>month</th> <th>Salary</th> </tr>
<tr>
<td>Amit Kumar</td> <td>January</td> <td>15000/-Rs.</td> </tr>
<tr>
<td>Rahul</td> <td>January</td> <td>12000</td> </tr>
</table>
</body> </html>


Result:-
Name month Salary
Amit Kumar January 15000/-Rs.
Rahul January 12000/-Rs.


e.g.2.1

There are two attribiutes cellpadding and cellspacing which can use to adjust the white space in your table cell. Cellspacing defines the width of the border, while cellpadding specifies the distance between cell borders and the content within.

<!DOCTYPE html>
<html>
<head>
<title>use of <tr> tag</title>
</head>
<body>
<table border="1" cellpadding="16">
<tr>
<th>Month</th> <th>Savings</th> </tr>
<tr>
<td>January</td> <td>$100</td> </tr>
</table>
</body>
</html>


Result:-
Month Savings
January $100


e.g.2.2

<!DOCTYPE html>
<html>
<head>
<title>use of <tr> tag</title>
</head>
<body>
<table border="1" cellpadding="16" cellspacing="5">
<tr>
<th>Month</th> <th>Savings</th> </tr>
<tr>
<td>January</td> <td>$100</td> </tr>
</table>
</body>
</html>


Result:-
Month Savings
January $100






Conclusion:--

So the <tr> tag is used to define a row in an HTML table in a webpage and <th> and <td> tags are used inside <tr> tag.You can understand it by above example.



Read More

<textarea> tag

The <textarea> tag is used to insert a multi-heritage(multiline) text input in the document or form in a webpage.Differently from the HTML input tag, as soon as the "type" attribute set to "text", this control can espouse to on peak of one descent of text as input. This feature, makes of this tag a best assuage on recieving comments or long messages.It is an HTML5 tag.It has opening and closing tags.
The <textarea> tag is destined to mass recommendation provided by the devotee. Once filled in, the content of this run can be submitted by the enthusiast and later recognized by a meting out agent that will handle the data collected. The content of <textarea> tag represents the manage's initial value. A text place can maintain an alter number of characters, and the text renders in a unadulterated-width font.

Optional Attributes for <textarea> tag :- autofocus|cols|disabled|formmaxlength | name | placeholder | readonly | required | rows | wrap



You can understand use of <textarea> tag by a simple example:-

e.g.1

<!DOCTYPE html>
<html>
<head>
<title>use of textarea tag</title>
</head>
<body>
<form action="xyzscript.php" /> <p>Message:-</p> <div><textarea name="address"cols="60" rows="5"></textarea></div> <div><input type="submit" /></div> </form> </body> </html>


Result:-

Message:-


If you want to merge header then use colspan attribute.Just like we use in above example.

e.g.2

The size of a text area can be set by the cols and rows attributes or you can use css 'height' and 'width' properties.Attribute row is used to define the number of viewable rows. while cols is used to define the number of viewable columns.

<!DOCTYPE html>
<html>
<head>
<title>use of textarea tag</title>
</head>
<body>
<textarea rows="5" cols="60"> www.indianwebschool.com is india's leading web programming portal. </textarea> </body>
</html>


Result:-



<textarea> Tag Attributes


Attribute Value Description
autofocus autofocus Specifies that a text place should automatically acquire focus once the page loads
cols number Specifies the visible width of a text place
disabled disabled Specifies that a text place should be disabled
form form_id Specifies one or more forms the text place belongs to
maxlength number Specifies the maximum number of characters allowed in the text place
name text Specifies a name for a text place
placeholder text Specifies a quick hint that describes the declared value of a text place
readonly readonly Specifies that a text place should be read-only
required required Specifies that a text place is required/must be filled out
rows number Specifies the visible number of lines in a text place
wrap hard
soft		 Specifies how the text in a text place is to be wrapped following submitted in a form


Conclusion:--

So the <textarea> tag to add a multi-heritage(multiline) text input in the document in a webpage.The <textarea> tag is destined to mass come taking place in the middle of the keep for advice provided by the adherent. Once filled in, the content of this run can be submitted by the adherent and fused ascribed by a dispensation agent that will handle the data collected.



Read More

<tfoot> tag

The <tfoot> tag is used to define a group footer rows in an HTML table. The <tfoot> element is used in conjunction with the <tbody> and <thead> tags in the table tag to specify each part of a table (header, body, footer).The <tfoot> tag have one or more and tags inside.It is an HTML5 tag.It has also opening and closing tags.

Optional Attributes :- align|valign|char|charoff
These attributes are not supported in HTML5,but in od versions of HTML theseare valid.
align=left| center|right|justify|char ---- (horizontal alignment of cells in group)
char=Character---- (alignment character for cells)
charoff=Length ----(alignment character offset)
valign= top|middle|bottom|baseline---- (vertical alignment of cells in group)

You can understand use of <tfoot> tag by a simple example:-

e.g.1

<!DOCTYPE html>
<html>
<head>
<title>use of tfoot tag</title>
</head>
<body>
<table border="1" width="100%">
<thead> <tr> <th>Header 1</th> <th>Header 2</th> <th>Header 3</th> </tr> </thead>
<tfoot> <tr> <td>Footer(tfoot)</td> </tfoot>

<tbody>
<tr> <td>Cell 1</td> <td>Cell 2</td> <td>Cell 3</td> </tr>
<tr> <td>Cell 4</td> <td>Cell 5</td> <td>Cell 6</td> </tr>
</tbody>
</table>
</body> </html>


Result:-
Header 1 Header 2 Header 3
Footer (tfoot)
Cell 1 Cell 2 Cell 3
Cell 4 Cell 5 Cell 6

If you want to merge header or footer then use colspan attribute.Just like we use in above example in footer.

e.g.2

<!DOCTYPE html>
<html>
<head>
<title>use of tfoot tag</title>
</head>
<body>
<table border = "1">
<thead>
<TR> <td>Name</td><td>Month</td><td>Salary</td></tr> </thead>
<tfoot> <TR> <td colspan="2">Total Earnings </td><td>27000/-Rs. </td></tr> </tfoot>
<tbody> <tr> <td>Ramesh</td> <td>january</td> <td>12000/-Rs.</td> </tr>
<tr> <td>Anil</td> <td>January</td> <td>15000/-Rs.</td> </tr>
</tbody>
</table> </body>
</html>


Result:-
NameMonthSalary
Total Earnings 27000/-Rs.
Ramesh january 12000/-Rs.
Anil January 15000/-Rs.




Conclusion:--

So the <tfoot> tag is used to define a group footer rows in an HTML table and used in conjunction with the <tbody> and <thead> tags in the table tag to specify each part of a table.



Read More

<th> tag

The <th> tag is used to define a header cell within an HTML table in webpage. The <th> element is used in conjunction with the <tr> and <td> tags in the table tag to specify row and columns in the table.It is an HTML5 tag.It has opening and closing tags.

There are two types of cell In an HTML table:-
1.Header cell-that contains information created with the <th> tag and the text in this section is by default bold and centered.
2.Standard cells- contains data created with the <td> tag and the text in this tag is by default regular and left-aligned. We use colspan and rowspan attributes to merge columns and rows respectively.

Optional Attributes :- align|axis|char|charoff|colspan|rowspan|bgcolor|headers|heights|nowrap|scope|valign|width

Some of these attributes are not supported in HTML5 (width|valign|nowrap|height|headers|charoff|char|bgcolor|axis|align).


You can understand use of <th> tag by a simple example:-

e.g.1

<!DOCTYPE html>
<html>
<head>
<title>use of th tag</title>
</head>
<body>
<table border="1" width="100%">
<caption>Earnings</caption>
<tr> <th>Day</th> <th>Earning</th> </tr>
<tr> <td>Monday</td> <td>$150</td> </tr>
<tr> <td>Tuesday</td> <td>$200</td> </tr>
</table>
</body> </html>


Result:-
Earnings
Day Earning
Monday $150
Tuesday $200

By using caption tag you can add caption at top of table.

e.g.2

You can merge columns by using colspan.
just like <th colspan="2or3or4...">

<!DOCTYPE html>
<html>
<head>
<title>use of th tag</title>
</head>
<body>
<table class="tg">
<tr> <th>Attribution</th> <th colspan="2">Value</th> </tr>
<tr> <td>Align</td> <td>Left</td> <td>Right</td> </tr>
</table>
</body>
</html>


Result:-
Attribution Value
Align Left Right


e.g.3

You can merge rows by using rowspan.
just like <th rowspan="2or3or4...">

<!DOCTYPE html>
<html>
<head>
<title>use of th tag</title>
</head>
<body>
<table class="tg">
<tr> <th">Attribution</th> <th>value</th> </tr>
<tr> <td class="tg-031e" rowspan="2">align</td> <td class="tg-031e">right</td> </tr>
<tr> <td class="tg-031e">left</td> </tr>
</table>
</body>
</html>


Result:-
Attribution value
align right
left



Conclusion:--

So the <th> tag is used to define a header cell within an HTML table in webpage.By using colspan and rowspan we can merge columns and rows respectively.



Read More

<thead> tag

The <thead> tag is used to define a group header rows in an HTML table. The <thead> element is used in conjunction with the <tbody> and <tfoot> tags in the table tag to specify each part of a table (header, body, footer).The <thead> tag have one or more and tags inside.It is an HTML5 tag.It has also opening and closing tags.

Optional Attributes :- align|valign|char|charoff
These attributes are not supported in HTML5.
align=left| center|right|justify|char ---- (horizontal alignment of cells in group)
char=Character---- (alignment character for cells)
charoff=Length ----(alignment character offset)
valign= top|middle|bottom|baseline---- (vertical alignment of cells in group)

You can understand use of <thead> tag by a simple example:-

e.g.1

<!DOCTYPE html>
<html>
<head>
<title>use of thead tag</title>
</head>
<body>
<table border="1" width="100%" align="center">
<thead>
<tr>
<th>Header 1</th>
<th>Header 2</th>
<th>Header 3</th>
</tr>
</thead>
<tfoot>
</tfoot>
<tbody>
<tr>
<td>Cell 1</td>
<td>Cell 2</td>
<td>Cell 3</td>
</tr>
<tr>
<td>Cell 4</td>
<td>Cell 5</td>
<td>Cell 6</td>
</tr>
</tbody> </table> </body> </html>


Result:-
Header 1 Header 2 Header 3
Cell 1 Cell 2 Cell 3
Cell 4 Cell 5 Cell 6


e.g.2

<!DOCTYPE html>
<html>
<head>
<title>use of thead tag</title>
</head>
<body>
<table border="1" width="100%">
<thead>
<tr> <tH>Weekday</tH> <tH>date</tH>
<tH>Manager</tH> </tr>
</thead>
<tbody>
<tr> <td>Monday</td> <td>04/06/2015</td> <td>Amit</td> </tr>
<tr> <td>tuesday</td> <td>04/07/2015</td> <td>rina</td> </tr>
<tr> <td>Wednesday</td> <td>04/08/2015</td> <td>Akshay</td> </tr>
<tr> <td>thursday</td> <td>04/09/2015</td> <td>Sunil</td> </tr>
<tr> <td>Friday</td> <td>04/10/2015</td> <td>rahul</td> </tr>
<tr> <td>Saturday</td> <td>04/11/2015</td> <td>Lokesh</td> </tr>
<tr> <td>Sunday</td> <td>04/12/2015</td> <td>Suman</td> </tr>
</tbody>
<tbody>
<tr> <td>Monday</td> <td>04/13/2015</td> <td>Amit</td> </tr>
<tr> <td>tuesday</td> <td>04/14/2015</td> <td>rina</td> </tr>
<tr> <td>Wednesday</td> <td>04/15/2015</td> <td>Akshay</td> </tr>
<tr> <td>thursday</td> <td>04/16/2015</td> <td>Sunil</td></tr>
<tr> <td>Friday</td> <td>04/17/2015</td> <td>rahul</td> </tr>
<tr> <td>Saturday</td> <td>04/18/2015</td> <td>Lokesh</td> </tr>
<tr> <td>Sunday</td> <td>04/19/2015</td> <td>Suman</td> </tr>
</tbody>
</table>
</body>
</html>


Result:-
Weekday date Manager
Monday 04/06/2015 Amit
tuesday 04/07/2015 rina
Wednesday 04/08/2015 Akshay
thursday 04/09/2015 Sunil
Friday 04/10/2015 rahul
Saturday 04/11/2015 Lokesh
Sunday 04/12/2015 Suman
Monday 04/13/2015 Amit
tuesday 04/14/2015 rina
Wednesday 04/15/2015 Akshay
thursday 04/16/2015 Sunil
Friday 04/17/2015 rahul
Saturday 04/18/2015 Lokesh
Sunday 04/19/2015 Suman




Conclusion:--

So the <thead> tag is used to define a group header rows in an HTML table and used in conjunction with the <tbody> and <tfoot> tags in the table tag to specify each part of a table.



Read More

<var> tag

The <var> tag is stand for variable tag. The Variable tag represents a variable in a mathematical expression or a programming context,although there are actually no restrictions where you can use this HTML tag. It has the opening and closing ends and text between these tags display as a variable text.It's display result is similar to <i> (italic) tag.

You can understand use of <var> tag by a simple example:-

e.g.

<!DOCTYPE html>
<html>
<head>
<title>var tag</title>
</head>
<body>
<p>
A simple equation: <var>x</var> = <var>y</var> - 4 </p>
</body>
</html>


Result:-

A simple equation: x = y - 4



Conclusion:--

So the <var> tag is used to define a varible in a mathematical expression or a programming context in webpage.

<var> tag का उपयोग गणितीय expressions or कंप्यूटर प्रोग्रामिंग में variables (परिवर्तनांक) को दिखाने के लिए किया जाता है जिसे आप ऊप्पर दिए गए उदाहरण से समझ सकते है


Read More

<title> tag

The <title> tag is used to define the title of webpage.This tag is necessary in all webpages.It is useful tag that defines a tittle in browser toolbar,provides a tittle for the page when you bookmark that page,display a title for the page in search-engine results. You can not add more than one <title> tag in an HTML document.It defines inside tags,before starting body tag.It also have opening and closing tags.It is an HTML5 tag.

You can understand use of <title> tag by a simple example:-

e.g.

<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
</head>
<body>
<p>
The title tag is added inside <head> tag. </p>
</body>
</html>


Result:- The title tag in browser toolbar look like it.
title-tag


Conclusion:--

So the <title> tag is used to define title of webpage.

<title> tag का उपयोग वेबपेज का title देने के लिए किया जाता है इस tag के कारण ही ब्राउज़र के टूलबार में आपके वेबपेज का टाइटल दिखाई देता है
Read More

<ul> tag

The <ul> tag is used to define unorder list.This tag is used when we want to create ordered bulleted lists in a webpage document.To Create a unordered list We Use the <ul> tag together with the <li> tag.This tag is generally use to create dropdown menu,navigations bars etc.This tag is used to give special design to a webpage When we use it with css.
We put <li> tag inside the <ul> tag and inside different <li> tags we put different list items.When we want to create a ordered list we have to use <ol> tag that stand for ordered list. In <ul> tag we can define inline css by using <style> tag.

You can understand use of <ul> tag by a simple example:-

e.g.

<!DOCTYPE html>
<html>
<body>
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
</body>
</html>


Result:-
  • Coffee
  • Tea
  • Milk


Conclusion:--

So the <ul> tag is used to define unordered list inside a webpage.

<ul> tag का उपयोग unordered लिस्ट बनाने के लिए किया जाता है unordered लिस्ट में item के आगे नंबर ना होकर बुलेट्स(bullets) का उपयोग किया जाता है


Read More

<u> tag

The <u> tag reffered to underline tag.This tag is used when we want to underline specific text in a webpage document.Underline tag is used to Set proper titles apart from regular text,Clarify an unfamiliar word.Any text that we want to underline put inside the opening and closing <u> tag.It is also include in HTML5 tags.

You can understand use of <br> tag by a simple example:-

e.g.

<!DOCTYPE html>
<html>
<body>
<p>
The capital of India is <u>Delhi</u>.
</p>
</body>
</html>


Result:-

The capital of India isDelhi.



Conclusion:--

So the <u> tag use to underline a text in a webpage paragraph.

<u> tag का उपयोग निर्धारित पैराग्राफ में निर्धारित टेक्स्ट को अंडरलाइन करने के लिए किया जाता है इस tag का उपयोग हम तब करते है जब हम पैराग्राफ में किसी टेक्स्ट को विशेष रूप से दिखाना चाहते है


Read More

<ins> and <del> tags

The <ins> and <del> tags are used to show edits in the webpage documents.So respectively <del> tag used to define text that has been deleted and <ins> tag deine insert text in the document of a webpage . Browsers will normally strike a parentage(line) through deleted text and underline inserted text.Both of tags required end tag(</del>,</ins>).The text that is edited(either deleted or inserted) put inside opening and closing tags.

You can understand use of <ins> and <del> tag by a simple example:-

e.g.

<!DOCTYPE html>
<html>
<body>
<p>
The capital of India is <del>Kolkata</del> <ins>Delhi</ins>.
</p>
</body>
</html>


Result:-

The capital of India is Kolkata Delhi.



The capiatl of india earlier was kolkata and now it is delhi so we use del and ins tag to define these edits in webpage documents.


The following attributes can be set for both the <ins> and <del> tags:-

<ins> and <del> Tag Attributes

<ins cite="why.htm">specify the inserted reason</ins>
<ins datetime="2015-04-04T20:53:03Z">specify the time at inserted</ins>

Attribute Value Discription
cite URL Specifies a URL to a document that explains the reason of edited text (inserted/deleted)
datetime YYYY-MM-DDThh:mm:ssTZD Specifies the date and time when the text was edited.


Conclusion:--

So the <ins> and <del> tags are used to define edited text in a webpage document.

<ins> and <del> tag का उपयोग webpage के document में पुराने और नये changes को show करने के लिए किया जाता है जैसे की इंडिया की राजधानी पहले कोलकाता थी और अब दिल्ली हो गयी है और आप चाहते है की इंडिया की पुरानी और नयी दोनों राजधानियाँ webpage में show हो तो आप <ins>और <del> का उपयोग कर सकते है
Read More

<video> tag

The <video> tag specifies video, such as a movie scrape or new video streams in an HTML page.Currently supported video formats for the <video> tag:MP4|WebM|Ogg.
<video> tag is new in HTML5 tags.

You can understand use of <video> tag by a simple example:-

Adding video using video tag:-


e.g.

<!DOCTYPE html>
<html>
<body>
<video width="320" height="180" controls>
<source src="http://....movie.mp4" type="video/mp4" >
<source src="http://....movie.ogg" type="video/ogg" >
Your browser does not support the video tag. </videogt;

</body>
</html>


Result:-

Any text between the <video> and </video> tags will be displayed in browsers that do not support the <video> element.


Adding video using iframe tag:-


e.g.

<!DOCTYPE html>
<html>
<body>
<iframe width="320" height="180" src="https://www.youtube- nocookie.com/embed/KtPv7IEhWRA?rel=0&controls=0&showinfo=0" frameborder="0" allowfullscreen ></iframe>

</body>
</html>


Result:-


The following attributes can be set for the <video> tag:-

<video> Tag Attributes

Attribute Value Description
autoplay autoplay video will start playing as soon as webpage load
controls controls Specifies that video controls(play/pause button etc.)
height pixels height of the video player
width pixels width of the video player
loop loop video will start over again, every time it is finished
muted muted video will be muted
src URL Specifies the URL of the video


Conclusion:--

So the <video> tag use to insert a video in a webpage.It is inserted in webpage by video src.

<video> tag का उपयोग webpage में video को Add करने के लिए किया जाता है जिस video को वेबपेज में add करना होता है उसे src attribute में define किया जाता है
Read More

<img> tag

The <img> tag use to define(show) an image in an HTML page.The two general attributes required for <img> tag are *src*,*alt*.Image is inserted in a web page by source link(address of server upload img). In HTML the <img> tag has no end tag while in XHTML the <img> tag must be properly closed.Dimensions(height&width) are also set by height and width attributes.Image should be in proper dimension before uploading at server it reduces the web page loading time.Image provides a marvellous look to a webpage.

You can understand use of <img> tag by a simple example:-

Unclickable Image:-
When you want to add an unclickable image you can useimg tag.

e.g.

<!DOCTYPE html>
<html>
<body>
<img src="http://lh5.googleusercontent.com/-vl88LT8- 2VI/AAAAAAAAAAI/AAAAAAAAADk/qZP_A1aQNZo/s80-c/photo.jpg" alt="HTML Tutorial" height="150" width="140" / >

</body>
</html>


Result:- indianwebschool


Clickable Image:-
When you want to add an image to a link(webpage) you can use anchor tag with img tag.

e.g.

<!DOCTYPE html>
<html>
<body>
<a href="https://indianwebschool.blogspot.com/"> <img src="http://lh5.googleusercontent.com/-vl88LT8- 2VI/AAAAAAAAAAI/AAAAAAAAADk/qZP_A1aQNZo/s80-c/photo.jpg" alt="HTML Tutorial" height="150" width="140" alt="indianwebschool" / ></a>

</body>
</html>


Result:- indianwebschool


The following attributes can be set for the <img> tag:-

<img> Tag Attributes

Attribute Value Description
align top Specifies the alignment for the image.
bottom
middle
left
right
alt text Specifies an alternate text for an image
src URL Specifies the URL of an image
vspace
hspace		 pixels Specifies the whitespace on top and bottom of an image
pixels Specifies the whitespace on left and right side of an image
width
height		 pixels Specifies the width of an image
pixels Specifies the height of an image


Conclusion:--

So the <img> tag use to insert a image in a webpage.It is inserted in webpage by image url.

<img> tag का उपयोग webpage में पिक्चर को Add करने के लिए किया जाता है यह webpage में url code के द्वारा add किया जाता है जिस पिक्चर को वेबपेज में add करना होता है उसे src attribute में define किया जाता है alt attribute का उपयोग पिक्टुरेस से related text को define करने के लिए किया जाता है
Read More