Learn HTML Simple Way

Labels: ,

                          ​HTML


  • Introduction to HTML in English :

HTML is a computer language devised to allow website creation. These websites can then be viewed by anyone else connected to the Internet. It is relatively easy to learn; and quite powerful in what it allows you to create.
 It is constantly undergoing revision and evolution to meet the demands and requirements of  the growing Internet audience under the direction of the » W3C, the organization charged with designing  and maintaining the language. 

1.1 Understanding and using HTML 



HyperText is the method by which you move around on the web — by clicking on special text called

hyperlinks which bring you to the next page. The fact that it is hyper just means it is not linear — i.e. you can go to any place on the Internet whenever you want by clicking on links — there is no set order to do things in. Markup is what HTML tags do to the text inside them. They mark it as a certain type of text (italicized text, for example). 



HTML is a Language, as it has code-words and syntax like any other language. HTML is a language for describing web pages. 

• HTML stands for Hyper Text Markup Language 

• HTML is not a programming language, it is markup language . 

• A markup language is a set of markup tags 

• HTML uses markup tags to describe web pages.
So the HTML teaches you to create your own Website easily.

 1.2   What are HTML Tags? 

 The tags are what separate normal text from HTML code. You might know them as the words between the . They allow all the cool stuff like images and tables and stuff, just by telling your browser what to render on the page. 
 Different tags will perform different functions. The tags themselves don’t appear when you view your page through a browser, but their effects do. The simplest tags do nothing more than apply formatting to some text, like this:   
 <b>These words will be bold<\b>, and these will not.
 In the example above, the tags were wrapped around some text, and their effect will be that the contained text will be bolded when viewed through an ordinary web browser. HTML markup tags are usually called HTML tags 
 • HTML tags are keywords surrounded by angle      brackets like 
 • HTML tags normally come in pairs like and 
 • The first tag in a pair is the start tag; the second tag is the end tag

1.3  Getting started with HTML

HTML is written simply in a plain text editor like Notepad. Advanced developers also use software like Frontpage, Expression Web & Dreamweaver.


1.3.1 Saving HTML Web Page

When you save an HTML file, you can use either the .htm or the .html extension. We use .htm in our 
examples. It is a habit from the past, when the software only allowed three letters in file extensions. With new software it is perfectly safe to use .html.

1.3.2 Understand the HTML Web Page Structure

<html> <body> Hello, Student </body> </html>

The text between <html> and </html> describes the web page. The text between <body> and </body> is the visible page content. This is the common structure of all the HTML Web Pages. Always you have to Start the HTML Page with opening HTML and Body Tags <html> and <body> and after putting all the content you need in the Web Page, You need to close the opened tags by </body> and </html>, in the order they were opened.



1.4 HTML Elements


An HTML element is everything from the start tag to the end tag. <p>This is Some Content.</p> Here everything for start paragraph tag to end tag is the HTML Element. The content between the tags “This is Some Content.” is known as the element content.


1.4.1 HTML Element Syntax

• An HTML element starts with a start tag / opening tag. • An HTML element ends with an end tag / closing tag. • The element content is everything between the start and the end tag. • Some HTML elements have empty content. • Empty elements are closed in the start tag. • Most HTML elements can have attributes.

1.4.2 Nested HTML Elements

The HTML Elements can be nested, that is one element can be inside the other element. <html> <body> <p>Hello World</p> </body> </html> Here there are three elements <html>, <body> and <p>. <p> tag is nested inside <body> which in turn is nested inside <html>. Always remember to put the End Tags after opening the tags.

1.4.3 Heading Tags

There are six levels of headings in HTML specified by <H1>, <H2>, <H3>, <H4>, <H5> and <H6> tags. <h1> defines the largest heading and <h6> defines the smallest heading. <html> <body> <h1>My First Heading.</h1> <h2>My Second Heading.</h2> </body> </html> Output:
HTML headings are defined with the <h1> to <h6> tags. <h1> is the biggest font size and <h6> is the smallest.

1.4.4 Hyper Links Tags

These are the tags that really made web pages unique, by letting a person click on text or an image and go to other webpage. Hyperlink tag is a container tag, which means there must be an initial tag and an ending tag. All the web pages in a website are connected to one another using the Hyperlinks. <html> <body> <a https://simplelearnhtml.blogspot.com/ Home Page </a> </body> </html> Output:

1.4.5 Image Tags

This Tag is used for putting pictures or images on your web page. The images can be of any format that is JPG, GIF, PNG etc. The <img> tag is empty, which means that it contains attributes only and it has no closing tag. <html> <body> <img src="Logo.jpg" width="250" height="100" /> </body> </html>
Output:
Note: The Image Tags contains number of attributes like src that is source of the file, width, height of the image, alt attribute etc.

1.5 HTML Comments

All combinations of text placed within the comment tags will be ignored by the web browser; this includes any HTML tags, scripting language(s), etc. <html> <body> <!-- <h1>My First Heading.</h1> -->
<h2> Akshay Dagle</h2> </body> </html> Output :

Note: First Heading would not be displayed as it is commented. So the browsers just ignore everything inside the comment tag.


1.6 HTML Styling Tags 

You may want to change the way the generated HTML output looks. The best way to do that is with a Cascading Style Sheet (CSS), which modern browsers support. Font family, type size, colors, and other styles can be controlled with CSS for each kind of element. Connect CSS to a Webpage Insert the link of CSS Files into the HTML file. The link is to be put in the <HEAD> element. 

<link rel="stylesheet" href="stylesheet.css" type="text/css"> 

The above tag links the CSS file named “stylesheet.css” to the current Web page.


1.11 HTML Table Tags

‘table’ Tag The <table> tag defines an HTML table. A simple HTML table consists of the table element and one or more ‘tr’, ‘th’, and ‘td’ elements. The ‘tr’ element defines a table row, the ‘th’ element defines a table header, and the ‘td’ element defines a table cell. <html> <body>
<table class="table"> <tr> <th> Name </th> <th> Email </th> <th> Remark </th> </tr> <tr> <td> Akshay </td> <td> akshay@gmail.com </td> <td> Pass </td> </tr> <tr> <td> Anushka </td> <td> akshay@gmail.com </td> <td> fail </td> </tr> <tr> <td> Shahrukh</td> <td> akshay@gmail.com </td> <td> Pursing </td> </tr> </table> </body> </html>
Output:

Note: <table> tag is used to start drawing the table <th> is used to define table header <td> is used to define the table cell




0 comments:

Post a Comment