Learning HTML 5

Let's learn HTML 5.0 with advance features. Click the particular section. This code is tested in sublime and visual studio code editor. 

->You are advised to use either sublime or visual studio code editor.

->I prefer visual studio code editor.  you can use sublime.

->As you type this, save it with an extension .html/.htm and preview by using browser.

->I have used Chrome as browser, OS is Windows-10

-------------------------------------------------------------------------------------------------------------------------

1 ) HTML basic:

                          Here we will learn basic concept of HTML.

2) HTML attributes:

                         Here we will learn about attributes with elements.

3)HTML headings:

                        Here we will learn about different heading used in HTML.We will be using <H1> to <H6> tags.

4)HTML paragraphs:

                        Here we will learn about paragraphs used in HTML. For this, we will use '<p>' tag.

5)HTML styles:

                          If we want to style our html page, we have to use css. We can use css in different way.

6)HTML formatting:

                        Here we will learn about formatting for text/paragraphs used in HTML(like we do in MS-word). For this, we will use tags <B>, <I>, <U> etc

7)HTML quotations:-

                       Here we will learn about different quotes and citations  we can use in our text.For this we will use tags like, <blockquote>,<address>,<cite>,<bdo> etc.

8)HTML comments:-

                      If we want our html page to be documented/described such that a reader can understand that easily then we use it. For this, we use description <!-- explanation goes here-->

9)  HTML marquee:-

                       We can scroll our text or video or picture left to right or right to left or any other direction and for limited time. This can be done in html using marquee tag. It is now obsolete.

10) HTML with font tag:-

                      It helps us to change font size with its color name etc. For this we use font tag.

11)HTML with horizontal ruler/line:

                    We have a tag named hr.It is helpful to draw horizontal line in our page. We can use attributes like size,width,color etc

12)HTML with pre tags:

                  This tag 'pre' is helpful if we want to display our contents in same way as it is written.

13)HTML with colors:

                   If we want to color our page(may be background or text or paragraph), then we have to use css with html.

14)HTML links:-

               Linking our html pages are one of the important part of our site.Here we will be learning on how to link internal pages or external pages, or even single page. We have to use <a> tag.

15)HTML images:-

                     Here we will learn about, how to insert images with some their attributes/property. For this we use <img> tag. We can also use map with rec ,poly etc,we can insert background picture.We can also work with picture tag

16)HTML lists:-

                   If we want to write our text/paragraph in numbered or bulleted form, then we use it. For this we use <ol> or <ul> or <dd>.

17)HTML tables:-

                   Without tables, we can not store our data, may be in database or simply on page.Here we will learning about table creation using tags <table>, <th>, <tr> etc.

18) HTML form:- 

                            creating different layouts for data input is very simple process.We can do it using latest form tags.click the title part to know/learn practically in detail.

19) HTML Frameset:- 

                              IF we want to make multiple partition of our page and to show different content in different partition then we use frameset tag with frame src tag.

20) Inserting Media(video/audio) in html page:-

                                      We can insert video or audio or image file easily. For this we use some tags like embed src or object or video controls.

                                                      

21)HTML block and inline:

                  Putting our text in our page is not a big deal. But Way/format , we use for our data,it matters.for this we use tags <p>,<pre>,<section>,<figure> etc for block and inline  elements.

22) HTML iframe:-

                   If we want to display our web page with in a page. Then this is helpful. We use <iframe> tag with some attribute.

23)HTML file path:-

                  Our website may contains pictures or videos or audios in different location. How to open them? We have some tricks for them. Let's learn it

24)HTML head with metatag: 

                   We have to describe our website,its contents,authors etc such that any body can easily find it on Internet. So how to do it.

25)HTML layouts:-

                 First of all we create layout then we put our contents. Now the question is , how to create layout? we use CSS to create different layout. Let's learn it. Some more coming soon.

26)Making responsive web page:

                         If we visit website on different screen or device then it would look same. The website would adjust itself to different gadget with different screen. That we can make using responsive and a piece of code. We use css with viewport.

27)HTML programming code:-

                     If we want to use html with some programming code in same way as we write then we use some tags like <code>,<samp>,<kbd> etc

28)HTML entities(with nbsp):- 

                         Suppose, we want to write white space or > or < or & etc, how can we write that?

 For this we use its Decimal value with & and #.

29)HTML symbols:-

                         Somewhere if we want to insert symbols like $ or @ or Mathematical symbols we use that symbols decimal value with # and &.

30)HTML e-moji:-

                      May be while chatting or visiting web site, we can insert e-moji/small pictures. How to insert that in our page? We use its decimal number with &, #  used in utf-8.

31)HTML plugins:-

                    Plugins is a small program that extends the functionality of browser. Like To display Flash movies To display maps To scan for viruses To verify a bank id. We use object tag for this.

32)HTML with youtube videos:

                                         We can also play youtube video in our html page.For this we can sue iframe tag and youtube video link.

33)HTML graphics:-

                                 While developing applications, we may need to draw different pictures/shapes etc. for this either we can use CANVAS or  SVG concept. HOW to do that? click the link.

                        

                                  CANVAS

                                   SVG

 

                                  Difference between CANVAS and SVG