Basic HTML Commands — Which You Should Know
In this article, we will be discussing some basic Hyper Text Markup Language(HTML) commands.
If you are interested in web development best choice is , start your passion with HTML. HTML is very easy to learn. So don’t wait!
Modern Web Design
HTML: Structure
CSS: Presentation
JavaScript: Behavior
PHP or similar: Backend
CMS: Content Management
Basic steps: using tags
HTML uses tags to communicate to the client (browser) how to display text and images. Tags are contained in < > symbol. In most cases you start with the beginning tag, put in the word or words that will be affected by this tag, and at the end of the string of word(s), you place a closing tag.
For example, to create a title for a document you would do the following:
<title>HTML</title>
The closing tag normally contains a “/”.
HTML tags are not case-sensitive.
The HTML tag
The structure of the HTML document remains the concept of sandwich. As a sandwich always have two bread slices likewise HTML also has an opening and closing HTML tags.
<html>
…
</html>
The head tag
We can compare it with as human face is used to identify the person like that only HEAD tag is used to identify the content of page.
<html>
<head></head>
</html>
The body tag
The body tag follows the head tag.
Compare this with human body,it helps to understand quickly.
Headings, paragraphs, lists, quotes, images, and links are just a few of the elements that can be contained within the body tag.
<html>
<head>
</head>
<body>
</body>
</html>
The title Tag
A title tag allows you to specify a Document Title in your browser window. The title element is important because it describes the page and is used by search engines.
<html>
<head>
<title>First page</title>
</head>
<body>
This is a line of text.
</body>
</html>
Remember, the title usually doesn’t appear in the document itself, but in a title box or bar at the top of the window.
The <p> Element
If we want to create a paragraph, then we able to use this <p> element with it’s opening and closing tags.
<html>
<head>
<title>First page</title>
</head>
<body>
<p>This is a paragraph. </p>
<p>This is another paragraph. </p>
</body>
</html>
Headers
In HTML we have six level of headers. These are <h1>,<h2>,<h3>,<h4>,<h5> and <h6>.
<h1>This is a header 1 tag</h1>
Here, if we use <h1> we can get bold and big size text. for <h6> we able to get small size text.
It’s important to use headers only for headings.
The <hr> tag
To create a horizontal line, use the <hr> tag.
<html>
<head>
<title>First page</title>
</head>
<body>
<p>This is a paragraph. </p>
<hr>
<p>This is another paragraph. </p>
</body>
</html>
Comments
The browser does not display comments, but they help document the HTML and add descriptions, reminders, and other notes.
<! — Your comment goes here →
In the opening tag, we have a! symbol but in the closing tag we don’t have a! symbol, while we comment we need to consider that.
The <img> Tag
This tag is used to insert an image. This tag doesn’t have any closing tag.
<img src=”image.jpg” />
Here we need to mention the location of that image and in case the image can not be displayed, by using alt attribute specifies an alternate text that describes the image in word.
<img src=”image.jpg” alt=”” />
HTML Ordered Lists
Here is a numbered list with three items:
An ordered list starts with the <ol> tag, and each list item is defined by the <li> tag.
<ol>
<li> list item 1
<li> list item 2
<li> list item 3
</ol>
An unordered list starts with the <ul> tag.
Here is the same list using a unnumbered list format:
<ul>
<li> list item 1 </li>
<li> list item 2 </li>
<li> list item 3 </li>
</ul>
The <table> tag
If we want to create a table, then we use <table> for that.And also tables are divided into table rows with the <tr> tag and table rows are divided into table columns (table data) with the <td> tag.
<table>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
</table>
The <form> Element
By using HTML we can collect the details from user.And forms are defined by <form> element.
<body>
<form></form>
</body>
The <a> Tag
In HTML, links are defined using the <a> tag.
Links are also an integral part of every web page. You can add links to text or images that will enable the user to click on them in order to be directed to another file or webpage.
We use href attribute to define the link’s destination address:
<a href=””></a>
Formatting Elements
By using these we can specify the text style.
<body>
<p><b> Bold text </b> </p>
<p><strong> Strong text </strong> </p>
<p><i> Italic text </i> </p>
<p><small> Small text </small> </p>
<p><del> deleted text </del> </p>
<p><ins> inserted text </ins> </p>
<p><sub> subscripted text </sub> </p>
<p><sup> superscripted text </sup> </p>
</body>
The <strong> tag is a phrase tag. It defines important text.
Hope this helps. Share your thoughts too!
