What is Html?
Html stands for Hypertext markup language. It is not a programming language but it is a markup language. It is used to create web pages.
How does html look like?
Html contains tags known as html tags.
For example look at following html tag. It is a paragraph html element. It starts with less than angle bracket then html tag ‘p’ and then closing greater than bracket. In this case, p stands for paragraph. This is a paragraph tag.
<p>
Now every html element has a start tag and end tag. The above paragraph tag is an opening tag or starting tag. So we must have a closing tag. The paragraph element closing tag is as follows.
</p>
The closing tag is same as opening tag except that immediately after opening less than symbol we have forward slash present.
We have to write actual paragraph content between the opening and closing tag as follows.
<p>This is a paragraph html element or simply paragraph tag.</p>
There are many html elements available each one having a different purpose but the syntax of writing html element or tag is same. Look at some of the html elements.
<h1>This is a heading.</h1>
<span>This is to just write text content.</span>
<b>This tag is to make font bold.</b>
As you can see all the html elements must have an opening and closing tag and then the content has to be wrapped within these tags.
In this course, we are going to look at each element with sample content.
Not all html elements have to include opening and closing tag. There are few which consist of only one tag without the need to have a closing tag.
For example, if you want to draw a horizontal line on a web page then we have to use the following tag.
<hr>
This hr tag doesn’t have a closing tag. That is because it doesn’t have any content and it just draws a horizontal line.
Note that ‘hr’ stands for horizontal rule.
Right now you know html consists of many html elements and having closing and opening tag. But where to put all these elements or tags?
Normally you can write html in any simple text editor like notepad or wordpad and then save it as a .html or .htm extension.
Look at the following html document.
<DOCTYPE html>
<head>
<title>[Place your page title here]</title>
</head>
<body>
[Place your page content here]
</body>
</html>
Let’s look at each element of html document above.
The first line tells the browser that this is an html document.
We have our paragraph element or tag within the body tag. Whatever you write within the body tag is the only thing that you or any user will see in the browser.
Other than the content of body element nothing will be displayed in the browser.
Whatever content you want to display, you should write in body tag or element with help of html tags and once finished save a file with .html or htm extension.
You can give any name to your html file. Suppose, the page displays employee information then you can name it as ’employeeInfo.htm’ or simply ’employees.html’.
If it is a home page then you can set it as index.html.
The home page is nothing but the first-page user will see when he hit the website URL.
What is CSS?
Css stands for Cascading Style Sheet. This is used along with html.
The purpose of using css with html element is to give formatting to them so that to improve web page look and feel.
Once we go through html basics, we will learn css in detail. We will learn types of css and how to use them with html.
But for now, let’s focus on learning basic html. So let’s get started.