Basic Syntax of HTML with Example

Basic Syntax of HTML with Example:

To get in to deep with html its very important to understand and learn the basics syntax of html and understand syntax of html so lets dive in the basics of html programming and html what does it mean.

Before diving in lets see what is html and what html stands for:

HTML stands for hyper text markup language which means we use tags to markup the content on the page to identify it.

Step 1 :

Create a basic html file by giving a desired name of yours I recommend to give it as basic.html and save it on your workspace or desktop for quick access.

Step 2: Open basics.html file with default text editor if you are on MAC open it with text edit. If you are windows open it with notepad. The basic text editor on windows will be handling raw txt files and there is no special encoding going on with it and its simple txt file with extension .html or htm extension or notepad++ (Also read how to download and install notepad++ for html programming) or text wrangler, sublime or etc there are plenty of text editors to go with for html programming.

Step 3:

A Basic Paragraph Syntax HTML Tag:

Marking a paragraph is simple just Open up a paragraph tag and to do that open up a left angular bracket, followed by the character that represents the element P for paragraph and then close the opening tag with a right angular bracket. So this is the markup or the syntax of the opening P paragraph Tag. (A left angular bracket and a character P representing paragraph and right angular bracket.). Everything that browser basically going to do is look at the paragraph tag and everything after this tag is contained with in that paragraph.

Most elements are going to have both an opening and closing tag, when your browser or user agent is looking at this it says ok it’s the beginning of the paragraph and you also need to tell is where the paragraph ends.

So now go to the end the paragraph and close it the closing paragraph tag and closing tag looks almost exactly the same, so open it using a left angular bracket and then put a forward slash followed by the P and followed by the right angular bracket. So they are almost exactly the same.

The only difference between open and closing tag is that a forward slash which tells that the browser that it’s the end of the paragraph by declaring a closing tag and it always precedes the character that it identifies.

We have opening paragraph tag and the closing paragraph tag and in between we have content of the tag right in the middle and then the entire thing is considered as a Paragraph element. So when you hear HTML referred to as elements, basically elements refer to the tags and their content where as this is simply tag itself.

In addition to itself each of the tags can also have certain attributes. Some attributes are specific to the elements where as other attributes are called global attributes.

Here from above the paragraph tag doesn’t really have any specific attribute to it, but it does have some global ones that we could apply. If you want to apply an attribute for the paragraph with by adding an opening tab and adding it with space right after the character and type in the attribute. Let’s just add one by adding a language attribute so type in LANG and type in equals( =) to assign a value to it, and then in quotation marks you give it to value in this case we give it a language English as en.

So here we are telling the user agent that the contents of this paragraph are in English. Its very useful if you have a paragraph in different language like French in a paragraph or any other language in a paragraph.

So now we have name of the attribute and an equal sign which is basically an assignment operator and then you have the value. The values will always going to be contained within quotation marks.

By adding a paragraph html tag in basic syntax.html file doesn’t make any difference if we mention p tag or not any how browser knows how to render it as a default p tag anything outside the elements and identifies content to display it on browsers.

HTML syntax also allows us to create more complicated structures by nesting one element inside the of another one. Lets add with in a paragraph that we have some text that we wanted to emphasize. For example the last sentence, well if in front of the second sentence here we added an emphasize tag or em and close that em tag before the closing paragraph tag and now we have emphasized the last sentence which is nesting and it essentially makes a paragraph tag a parent tag and it makes the emphasize element a child element. So we have parent elements and we have child elements and nested together to create these more complex structure.

If you open the file in browser the output will be something like a paragraph in which the last sentence which is being italicized which is emphasized.

There are rules around this nesting as well for example certain tags cant nest inside of one other tags and other is the syntaxual rule that if you open a child element then that child element have to close before its parent element.

Content in html is identified by wrapping it in an html tag and also you can further enhance those usually with attributes that can either tell you more about the element or it can provide additional functionality for you. So, from this point forward its really just a matter of learning basic syntax of html tags and its appropriate to nest them properly and which tags you can nest inside one another, and attributes that you can use with each of them.

what is html used for:

Html is used for structuring your content in a markup and create word documents on the world wide web and make browser and search engines or user agents understand your content structure better by structuring layout of wed document with nested tags and attributes of html.

How do we Use HTML:

How do we use html is with tags and order list and attributes by providing proper tags with errors free with p tags and other tag elements.

What is Simple Html Definition:

When it comes to definition of HTML it stands for hyper text markup language which simply means structuring your document properly with tags and elements, attributes.

Is HTML easy to Learn:

Html is easy to learn as it includes learning no basic knowledge as html is the basic language for web browsers to understand its all how you represent your content to browsers. Like paragraph, header tags and sub heading tags and alignment of content etc.

what does html tag do

Html usually do make browser and user agent to understand and analyze your piece of content and represent to user properly aligning your content.

Author
Author
Ramana Tula is a Google Product Expert - He is a Full stack Web and Android Developer.

- Advertisement -