First template

Template

After gaining a Basic understanding of what Html is , we will now learn how to make web pages using Html.
As mentioned earlier Html works on three basic concepts –
1.Tags
2.Attributes
3.Elements ( which consists of the above two )

An Html code is written in any text editor for eg. Notepad is the most common editor used to write a Html Code
It is saved with the extension .html or .htm and the code is not case-sensitive.
Before learning to write any codes in Html it is important to know that any Html document consists of Two Parts
1.The Head section <head></head>
2.The Body Section <body></body>

To write a Html document we start by firstly specifing that the document contains Html code
This is done by writing the code in between a paired tag , which is <html> </html>
whenever we write </tag> it specifies that the effects of the tag comes at an end at that position.

THE HEAD SECTION or HEAD ELEMENT
The Head elements can provide meta information , tell the browser where to find stylesheets,give the title of the
document and much more.
The tags specified in this section always lie between the <head></head> tags
All the tags that fall under this section have little effect on the bulk of the data that you want to display on your website.Although Html contains a large

number of tags , the ones specified below will help you in developing a website with relative ease.

1.Meta Tag
The <meta> tag is a Singular tag (that means that in Html there is no need to close the tag, however in Xhtml it must be properly

closed). This tag is used to give metadata about the HTML document i.e
it is used to give descriptions , keywords for search engines,author etc.For eg.

<html>
<head>
<meta name=”Description” content=”Dropbox tutorial” />
</head>
</html>

2.Title tag
This is a paired tag(<title></title>). This tag defines the title of the document in the browser toolbar and also

provides the title of the page in search-engine results

<html>
<head>
<title> Drop Box </title>
</head>
</html>

– this will provide the document with the title “Drop Box” which will be
visible on the browser toolbar.

3.Script and Style tag
These tags are used to introduce Javascript and CSS (Cascading Style Sheets) into a HTML document to

make it more dynamic an provide a better user interface.These tags will be better explained later on

The head tag doesnt have any attributes of its own but is just used to specify the tags mentioned above. These tags

can only be used in the Head section and not anywhere else in the document.

THE BODY SECTION
The bdoy element contains various tags to display and manipulate the Data to be displayed on the webpag such as introduce
images, insert hyperlinks, modify text, lists etc.
The tags specified in this section lie in between the <body></body> tag. Unlike the head element, the <body> tag has a
number of attributes.
The data manupilation can take place in literally hundreds of ways , that is why we will give different posts to talk in detail
about the important ones like the Lists, images, tables etc.
Some important Body tag attributes are discussed below-

1.BGCOLOR

This attribute is used to give a background color to your document or table backgrounds
There are two ways in specifying the color for your document. The first and most simple one is to just write the
name of the color eg. red . However this doesnt provide you with a lot of color variation. For this purpose the bgcolor
attribute can also be specified by writing # followed by a six digit/character code.There’s 216 “true colors” with hexidecimal.
The colors are made out of hex-pairs for red, blue, and green. Examples: #99FFCC, #33AA44.

<table bgcolor=”lime” border=”1″><tr>
<td>A lime colored table background using color names.</td>
</tr></table>

<table bgcolor=”#ff0000″ border=”1″><tr>
<td>A red colored table background using hexadecimal values “#FF0000″.</td>
</tr></table>

<table bgcolor=”rgb(0, 0, 255)” border=”1″><tr>
<td>A blue colored table background using RGB values “rgb(0, 0, 255)”.</td>
</tr></table>

2.Background Image

This attribute is used to give a background image to the page or a particular cell of a table
It has a further attribute norepeat that prevents the image from being repeated if it does not fit the browser window

<body background=”abc.jpg” norepeat=”norepeat”>

The next post will give a overview of the Font and image tag along with the different types of lists

Advertisements