Monday, January 29, 2018

HTML - Class 2 (HTML's (Elements,Attributes, Headings, paragraphs))

Assalam u Alikum Guys,

Now we move toward All things of HTML that are frequently used in web designing.
  • HTML Elements
An Element of HTML refers to "Everything that is have Starting Tag and Ending Tag"
<tagname>Content goes here...</tagname>

Starting Tag : <html>  ,   <h1>   ,    <p>
Ending Tag : </html>  ,   </h1>   ,    </p>

HTML element with no content known as Empty element. 
like : <br> or <input> etc.

HTML tag can also be Nested means on Tag in between of an another Tag.
like : <p>Hello ! My name is <h1>Asad</h1>. I am from Pakistan.</p>


NOTE : A common mistake usually made by Developer is : Leave the ending Tag that cause unusual behavior. or not properly implementation of Web Design.

  • HTML Attribute
Attributes belongs to Element or Tags of HTML. 
Basically, describe any Element or gives information of any Element of HTML.
Some of attributes are :
"lang" for <html> Tag.
"src" and "alt" for <img> Tag
"width" and "height" for more than one Tags.

All HTML elements have different and some common attributes.
Attributes are discuss in detail in Upcoming POSTs when we Discussing each Tag individually.

NOTE : use small letters for attribute as well as use single quotes or double quotes for attribute value.
  • HTML Headings 
Every one what are Headings so, i just tell you how to use Headings in HTML.
<h1> to <h6> tags are used for Headings
<h1> is largest Heading and <h6> is the Smallest.

Something liike this :

This is heading 1

This is heading 2

This is heading 3

This is heading 4

This is heading 5
This is heading 6

  • HTML Paragraph
HTML paragraphs are defined by using : <p> Tag.
Example : 
--------------------------------------------------------------------------------------------------------------------------
<!DOCTYPE html>
<html>
<body>

<p>This is a paragraph No 1.</p>
<p>This is a paragraph No 2.</p>
<p>This is a paragraph No 3.</p>

</body>

</html>
--------------------------------------------------------------------------------------------------------------------------

Another things is : 
In HTML, we can't change the Result with some extra spaces or extra lines in our HTML code.
Our browser will remove all extra spaces and extra lines when the page is displayed in Browser.

so, Keep all format that used in HTML coding we can use <pre> Tag. Means all extra spaces and extra lines remain display in browser

Example : 
--------------------------------------------------------------------------------------------------------------------------
<!DOCTYPE html>
<html>
<body>

<pre>
This 
is          a 
paragraph         ...... Hello        World. . . .
</pre>

</body>

</html>
--------------------------------------------------------------------------------------------------------------------------

Thanks for paying Attention !

Tutor : Asad Saleem



2 comments: