More About on HTML
Category : 8th Class
More About on HTML
Introduction to HTML
HTML language is developed by Tim Berner-Lee at CERN (Consiel European pour la Research Nuclear) to enable permit the researchers to share their research papers with the help of the Internet. Generally all the browsers support HTML, but basically it was used by Mosaic Browser. The HTML 1.0 is the first version of HTML, whereas continuous growth of Web extended HTML growth in several other ways. World Wide Web Consortium (W3C) is the organization which did not specify the first version of HTML. This organization maintains the language and keeps evolving it in proper direction. Latest version of HTML is HTML 5.01 which is in general use and is the sub version of HTML 5.0. The errors which are occurring in HTML 5.0 have been fixed in this version.
The whole HTML document comes under the <html>tag which is used as a container. The entire content of the HTML page comes under the opening and closing of the <html>tags. This <html>tag indicates the browser this is the starting of the document and the closing </html>tag indicates that it’s the ending of an HTML document.
The following is the syntax:
<html>
……………...
Contents mentioned in the page
……………...
</html>
For the heading of the HTML document, the tag which is used is <head>tag. The information contains some certain headings regarding documents that come under this. There are only few tags which are valid under the heading section. These are the following:
<link>tag : Defines reference for the resource.
<base>tag : Defines a base URL for all the links present on a page.
<meta>tag: Defines the Meta- Information such as keyword and descriptions for search engines and refresh rates about the page.
<script>tag : The HTML page uses the script which is defined by this tag.
<style>tag : Defines the internal style sheet for the HTML page.
The contents of the HTML document describe under the <body>tag. The contents of a web page whatever they are defined between the opening and closing of the <body>tag, it may be a text, audio, video and images all conies under this tag.
HTML Lists
To itemize the information in a concise format, the list makes it easy. It is used to present the elements in an attractive way and very clearly so that the user can read as well as understand it easily.
You can create three types of lists in HTML:
Ordered List
The list of items in which each item of the list has a specific numerical order comes under the ordered lists. The ordered list is also known as numbered lists. The order number can be alphabetical or numeric and that can be either a lower case or upper case. By using <ol> tag ordered list is created. With the <li> tag, the items of list are created.
The following syntax is used for creating an ordered list:
<ol>
<li> item 1</li>
<li> item 2>/li>
</ol>
Unordered List
The list which appears as a list of items and bullets and the items are presented separately comes under the unordered lists. To create the unordered lists of items the <ul> tag is used and <li> tag is used to create the elements.
The following is the syntax which is used to create the unordered list:
<ul>
<li> list item 1 </li>
<li> list item 2 </li>
</ul>
Definition List
The lists and explanation of the terms comes under the definition lists.
The tags which are used to create definition list are:
It starts with the definition list <dl> tag.
The <dt> tag is used for the definition list term.
The <dd> tag is used for the definition list definition starts.
The following syntax is used to create a definition list:
<dl>
<dt>this is definition term
<dd>this is definition</dd>
</dt>
</dl>
Images in HTML
HTML’s multimedia features allow you to include images, audio clips, video clips. And other multimedia elements in the web pages.
Insert Image
You can insert any image in your web page by using <img> tag.
Syntax
<img src =“Image URL” alt = “some_text”>
Example
<Html>
<Head>
<Title> Inserting image in webpage </title>
</head>
<Body>
<img src = “/html/images/computer.png” alt = “Computer Image”>
</body>
</html>
Set Image width /Height
You can set image width and height based on your requirement using width and height attributes. You can specify width and height of the image in terms of either pixels or percentage of its actual size.
Example:
<Html>
<Head>
<Title> Set image width/Height ></title>
</head>
<Body>
< img src = “/html/images/computers.jpg”
alt = “Computer Image” height = “150”
Width = “150” /7
</body>
</html>
Set Image Border
By default image will have a border around it, you can specify border thickness in terms of pixels using border attributes. A thickness of 0 means, no border around the picture.
Example:
<Html>
<Head>
<Title> Set Image Border </title>
</head>
<Body>
<img src = “/html/image/computers.jpg” alt = “Computers image” border = “3”/>
</body>
<Html>
Set Image Alignment
By default image will align at the left side of the page, but you can use align attribute to set it in the center or right.
Example:
<Html>
<Head>
<Title> Set Image Alignment </title>
<img src = “/html/images/computer.jpg” alt =“Computers
Images” border = “3” align = “right” >
</body>
</html>
Introduction of Links
The page of a website is connected through the links. By clicking on a link, a user navigates to a new page of a website. You can break a long document into multiple pages which allows you to navigate from page to page easily, and this can only be done through the links. Basically, links are having two basic components and these are Targets and Links.
How to Use Anchor Tag
The main element of the hypertext links in HTML is the anchor tag <a>. To connect one document to another document, it is used to create a hypertext link.
Different Types of Links
There are basically three types of links available in HTML:
Hypertext Link
With the help of hypertext, the hypertext link is created. It may be underlined or coloured. The links between the web pages that can be either located in the same site or other site is created by hypertext link.
The following are the types of Hypertext links:
Bookmark Links
To connect one section to another section within the same document or to a specific section within another document, a bookmark link is used. Basically, it consists of two documents. A target which acts as an identifier that designates the target of the link and a link where you click.
Email Link
A type of link that is used to create links, which open up an email application, is an email link. A new message window is opened, when you click on the link. Using <a> tag email link is created.
You need to login to perform this action.
You will be redirected in
3 sec
