Updated July 4, 2023
Introduction to HTML Commands
HTML means Hyper Text Markup language, a standard markup language for web pages. HTML will have elements, attributes, and other tags. Most of the websites present on the internet use HTML. HTML is easy to learn and powerful. Hyper Text is the major method of moving around the web by clicking on Hyperlinks, which redirect to another page. Markup shows text inside them using HTML tags by marking a test as a certain type. HTML Command elements are building blocks of an HTML page and can have attributes that provide additional information about the element, and attributes will be present in pairs.
Basic HTML Commands
The basic commands are as follows:
1. Sample HTML document syntax
Sample HTML documents will have HTML elements which are building blocks of web pages, and some of the HTML elements are <HTML>, which is a root element, <meta> which will have meta information,<title> which contains a title of the document and <body> which includes data of the document.
Code:
<!DOCTYPE html>
<html lang="en">
<meta charset="utf-8">
<title>Page Title</title>
<body>
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
</body>
</html>Output:
2. HTML Headings
HTML headings are HTML elements that are defined with tags <h1> to <h6> where <h1> defines the most important tag and <h6> defines the less important tag.
Sample HTML code with headings as below:
<h1> This is heading 1 </h1>
<h2> This is heading 2 </h2>
<h3> This is heading 3 </h3>
<h4> This is heading 4 </h4>Output:
3. HTML element paragraph
HTML paragraph is an HTML element that we define using the <p> tag, and the sample code is as follows:
<p> This is a paragraph </p>
<p> This is another paragraph </p>Output:
4. HTML images
HTML images is an HTML element defined with a tag <img>, and we need to mention attributes such as src of the image, alt means alternative text, width, and height of the image to display, and sample code is
Code:
<img src="educba.jpg" alt="educba" style="width:100px; height:50px">Output:
5. Html Lists
HTML lists is an HTML elements and defined using tags <ul> or <ol> where <ul> is an unordered list and <ol> is an ordered list
Code:
<ul>
<li> Coffee</li>
<li> Tea </li>
<li> Milk </li>
</ul>Output:
6. Create table
HTML table is an HTML element, and it can be defined using tag <table> and rows with tag <tr> and cells with tag <td> and code as below:
Code:
<table>
<tr>
<th>Firstname</th>
<th> Lastname</th>
<th>Age</th>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
</table>Output:
7. Mention link
HTML links are HTML elements, and they can be defined using the tag <a> the sample code is below:
Code:
<a href="https://www.educba.com">This is a link </a>Output:
8. Style attribute
HTML attribute style can be used with a combination of any HTML elements such as <p>, and the sample code is as below:
Code:
<p style="color:red"> I am a paragraph </p>Output:
9. lang attribute
In HTML, using the lang attribute, we can declare the language of the document using the <html> tag, and language is defined using the lang attribute, and sample code is as below:
Code:
<!DOCTYPE html>
<html lang="en-US">
<body>
...
...
</body>
</html>Output:
10. Format HTML elements
In HTML, we can use formatting elements to format the HTML document, and we can define special elements for text with special meaning. HTML elements like <b> for bold, <i> for italic
Code:
<b> This text is bold. </b>Output:
Intermediate HTML Commands
The intermediate commands are as follows:
1. Highlight Text
In HTML, we can highlight some text in an HTML document using element <mark> so that it highlights the text enclosed in <mark> element, and the sample code is as below:
<html>
<body>
<h2> html <mark> Marked </mark> formtting </h2>
</body>
</html>Output:
2. Delete text
In HTML, we can delete some text using <del> element so that the text which is enclosed between this element is deleted, and the sample code is as below:
<html>
<body>
<p> My favorite color is <del> Navy blue </del> Red </p>
</body>
</html>Output:
3. Define superscripted text
In HTML, we can define the text as superscripted using element <sup> in the HTML document so that text enclosed in <sup> element will be superscripted, and the sample code is as below:
<html>
<body>
<p> This is <sup> superscripted </sup> text </p>
</body>
</html>Output:
4. Define abbreviation
In HTML, we can define abbreviations by using the HTML element <abbr> in the HTML document, which will give useful information to browsers, and the sample code is as below:
<html>
<body>
<p> The <abbr title="World Health Organization" >WHO </abbr> was founded in 1948 </p>
</body>
</html>Output:
5. Mention Address
In HTML, we can mention the address in an HTML document using HTML element <address>, which defines contact information or address related to the article or document and displays in italics and the sample code as below:
<html>
<body>
<address>
Written by Srinivas <br>
dasu.com <br>
Pincode : 500084, Hyderabad <br>
India
</address>
</body>
</html>Output:
Advanced HTML Commands
The advanced commands are as follows:
1. Display a webpage inside a webpage
In HTML, we can display a webpage inside a webpage using HTML iframe, which is defined using the tag <iframe>, and the src attribute specifies the URL of the webpage. The sample code is as below:
<html>
<body>
<iframe src="demo.html" height="300" width="300" > </iframe>
</body>
</html>2. Target different targets using iframe
In HTML, we can use the target frame as a link using the iframe tag in the HTML document, and the target attribute to the link must refer to the name attribute of the iframe and sample code is as below:
<html>
<body>
<iframe src="demo.html" name="iframe1"> </iframe>
<p> <a href="www.google.com" target="iframe1"> Google.co.in </a> </p>
</body>
</html>Tips and Tricks to Use HTML Commands
- Make your visitors change the text color or background by adding extra code.
- Add metadata while writing an HTML document.
- It’s good to hide some fields where we don’t want a user to edit them.
- Always add a horizontal line to break long sections so the website will look good.
Conclusion
Finally, it’s all about different types of HTML commands of various levels are briefly discussed with examples. After reading this article, I hope you will have a good idea of how to use HTML commands.
Recommended Articles
We hope that this EDUCBA information on “HTML Commands” was beneficial to you. You can view EDUCBA’s recommended articles for more information.
