Mzsmunna
10/19/2019 - 1:44 AM
HTML Syntax
## HTML Boilar-Plate Code
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Title of your web page</title>
</head>
<body>
HTML web page contents
</body>
</html>
## HTML tag: It is the root of the html document which is used to specify that the document is html.
<html> Statements... </html>
## Head tag: Head tag is used to contain all the head element in the html file. It contains the title, style, meta, … etc tag.
<head> Contains elements describing the document </head>
## Title tag: It is used to define the title of html document
<tittle>tab name</tittle>
## Body tag: It is used to define the body of html document. It contains image, tables, lists, … etc.
<body> The content of your HTML page </body>
## Heading tag: It is used to define the heading of html document.
<h1>Heading 1 -- Biggest</h1>
<h2>Heading 2 </h2>
<h3>Heading 3 </h3>
<h4>Heading 4 </h4>
<h5>Heading 5 </h5>
<h6>Heading 6 -- Smallest</h6>
## Paragraph tag: It is used to define paragraph content in html document.
<p>GeeksforGeeks: Computer science portal</p>
## Emphasis tag: It is used to renders as emphasized text.
<em>GeeksforGeeks</em>
## Bold tag: It is used to specify bold content in html document
<b>Bold word</b>
## Italic tag: It is used to write the content in italic format
<i>GeeksforGeeks</i>
## Small (text) tag: It is used to set the small font size of the content
<small>Example</small>
## Underline tag: It is used to set the content underline.
<u>GeeksforGeeks</u>
## Deleted text tag: It is used to represent as deleted text. It cross the text content.
<strike>GeeksforGeeks</strike>
## Anchor tag: It is used to link one page to another page.
<a href="https://www.geeksforgeeks.org/"> GeeksforGeeks </a>
## List tag: It is used to list the content
<li>List item 1</li>
<li>List item 2</li>
## Ordered List tag: It is used to list the content in a particular order.
<ol>
<li>List item 1</li>
<li>List item 2</li>
<li>List item 3</li>
<li>List item 4</li>
</ol>
## Unordered List tag: It is used to list the content without order.
<ul>
<li>List item 1</li>
<li>List item 2</li>
<li>List item 3</li>
<li>List item 4</li>
</ul>
## Comment tag: It is used to set the comment in html document. It is not visible on the browser.
<!--Comment section-->
## Scrolling Text tag: It is used to scroll the text or image content.
<marquee bgcolor="#cccccc" loop="-1"
scrollamount="2" width="100%"> Example Marquee </marquee>
## Center tag: It is used to set the content into the center.
<center>GeeksforGeeks</center>
## Font tag: It is used to specify the font size, font color and font-family in html document.
<font face="Times New Roman">Example</font>
## Line break tag: It is used to break the line
GeeksforGeeks<br>A computer science portal
## Image tag: It is used to add image element in html document.
<img src="gfg.jpg" width="40" height="40" border="0">
## Link tag: It is used to link the content from external source.
<head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
## Horizontal rule tag: It is used to display the horizontal line in html document.
<hr width="50%" size="3" />
## Meta tag: It is used to specify the page description. For example: last modifier, authors, … etc.
<meta name="Description"
content="Description of your site">
<meta name="keywords"
content="keywords describing your site">
## Tables Tags: Table tag is used to create a table in html document.
<table border="4" cellpadding="2" cellspacing="2" width="100%">
<tr> <td>Column 1</td>
<td>Column 2</td> </tr> </table>
## Tr tag: It is used to define row of html table.
<table>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
</table>
## Th tag: It defines the header cell in a table. By default it set the content with bold and center property.
<table>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
</table>
## Td tag: It defines the standard cell in html document.
<table>
<tr>
<td>Cell A</td>
<td>Cell B</td>
</tr>
</table>
## Input Tags -> Form tag: It is used to create html form for user.
<form action="mailto:you@yourdomain.com ">
Name: <input name="Name" value="" size="80"><br>
Email: <input name="Email" value="" size="80"><br>
<br><center><input type="submit"></center>
</form>
## Submit input tag: It is used to take the input from the user.
<form method=post action="/cgibin/example.cgi">
<input type="text" style="color: #ffffff;
font-family: Verdana; font-weight: bold;
fontsize: 12px; background-color: #72a4d2;"
size="10" maxlength="30">
<input type="Submit" value="Submit">
</form>
## Dropdown option tag: It is used to select an option froma drop-down list.
<form method=post action="/cgibin/example.cgi">
<center> Select an option:<select>
<option>option 1</option>
<option selected>option 2</option>
<option>option 3</option>
</form>
## Radio button tag: It is used to select only one option from the given options.
<form method=post action="/cgibin/example.cgi">
Select an option:<br>
<input type="radio" name="option"> Option 1
<input type="radio" name="option" checked> Option 2
<input type="radio" name="option"> Option 3