HTML Online Tutorial Contents

Following are the posts for HTML online Tutorial. To learn everything about HTML, just read these posts: HTML Online Tutorial HTML TAGS (2) HTML BASICS (3) HTML ELEMENTS (4) HTML ATTRIBUTES (5) More »

XHTML

XHTML stands for Extensible Hypertext Markup Language. It is also known as XML (Extensible Markup Language). It is a markup language. In XHTML, there are no predefined tags. The user defines the More »

HTML SUMMARY

In this tutorial, you learned: HTML Introduction HTML Tags HTML Basics HTML Elements HTML Attributes HTML Paragraphs HTML Headings HTML Formats HTML Image HTML Links HTML Lists HTML Frames HTML Table After More »

HTML TABLES (13)

HTML Tables are used to arrange data in web pages. HTML allows the use of tables by <table>…</table> tags. Each row in HTML table is recognized by <tr>…</tr> tag. In each row More »

HTML FRAMES (12.2)

Nested frames example: For the following example to work, there are two other simple HTML files : “HMTL11e1 frame a.html” and “HMTL11e1 frame b.html”. your browser will divide your screeub half. The More »

 

Tag Archives: XHTML

paragraphs 1

HTML PARAGRAPHS (6.1)

HTML PARAGRAPHS:

HTML paragraphs are used to add text in web pages. The tag used for this purpose is <p>…</p>. The paragraph line’s width depends on the width of window or container. HTML adds a line before and after the paragraph in default.


Simple Paragraph:

HTML ignores extra added spaces in paragraphs. Multiple spaces will be displayed as one space.

Following is a simple example, which shows displaying of a paragraph.

Example5.1:

<html>

 

<head>

<title>Website-School/HTML Paragraphs example 1</title>

</head>

 

<body>

<p> This is a paragraph. This is a paragraph. This is a paragraph. This is a paragraph. This is a paragraph. This is a paragraph. This is a paragraph. This is a paragraph. This is a paragraph. This is a paragraph. This is a paragraph. This is a paragraph.</p>

</body>

 

</html>

 

Spaces in Paragraphs:

HTML ignores extra added spaces in paragraphs. Multiple spaces will be displayed as one space.

Example5.2:

<html>

 

<head>

<title>Website-School/HTML Paragraphs example 2</title>

</head>

 

<body>

<p> The     spaces              in              this                  paragraph                     is              ignored                     by                     HTML                                   </p>

</body>

</html>

The important attributes of the paragraph tag: Align

AT-TRIBUTE VALUES DISCR-IPTION
ALIGN RightCenterLeft (default value) It specifies the alignment of paragraph inside <P>…</p> tag. 

For more visit next posts in this category.To go back to Contents of this tutorial: Contents of HTML Tutorial

attributes 5

HTML ATTRIBUTES (5)

Html elements can also contain attributes. HTML attributes provide extra information about HTML elements. HTML attributes general syntax is name=”value”. Moreover HTML attributes are always defined in start tag.e.g.

<a href=”index.html”> index</a>

In this example href is given as an HTML attribute to the <a>…</a> tag. Note that attribute is given in start tag. Also note the syntax of defined attribute.


HTML Attributes:

Attributes values are always quoted. There are some cases when attributes values have either double or single quotation marks in them then the syntax should be:

Name=”value ’single quotes ’double quotes”

Name=’value ”double quotes” single qoutes’

In this example href is given as an HTML attribute to the <a>…</a> tag. Note that attribute is given in start tag. Also note the syntax of defined attribute.


Example4.1:

<html>

 

<head>

<title>Website-School/HTML Attributes example 1</title>

</head>

 

<body>

 

<img src=”homeb.gif” width=”153″ height=”73″ alt=”home” />

<p> This image is displayed using image tags inside the body tags. Src, width, height and alt are given as attributes to an image tag.</p>

</body>

</html>


For more visit next posts in this category.To go back to Contents of this tutorial: Contents of HTML Tutorial

elements 4

HTML ELEMENTS (4)

HTML elements are defined as a command that tells a browser to do something e.g. <title> tag pair. Everything inside the HTML tags is known as element contents. The start/opening tag defines the start of a HTML element. Similarly, the end/closing tag defines the end of a HTML element.


Example 1:

The <html> element defines whole html file. Similarly <head> element defines title of document using another <title> element.

EMPTY ELEMENTS:

Some HTML tags have nothing inside them. Such HTML elements are empty. Empty elements are often closed in start tag.

Example 2:

The line break tag is used to insert a line in document layout. It is closed in the start tag. Moreover it does not contain any content so it is empty element. e.g. </br>

HTML elements can also contain some attributes. e.g.


<a href=”index.html”> index</a>

In this example href is given as an HTML attribute to the <a>…</a> tag.

For more visit next posts in this category.To go back to Contents of this tutorial: Contents of HTML Tutorial

HTML BASICS (3)

The browser recognizes a HTML file with the help of <html>…</html> tags pair. Every html tag or element is written in between these tags. There are two sections of the document between this tag pair:

  • Head Section
  • Body Section

<script type=”text/javascript” src=”http://www.bluehost.com/src/js/securedlink/CODE14/488×160/bh_488x160_02.gif”></script>

The overall basic structure of an HTML file is:

<html>

 

<head>

</head>

 

<body>

</body>

 

</html>

 

  • HEAD SECTION:

The <head> and </head> tags identify the start and end of this section. In this tag title of document can be defined. The title of document can be defined using <title>…</title> tag pair. The text mentioned in between title tag should be less than and equal to 60 characters.

<script type=”text/javascript” src=”http://www.bluehost.com/src/js/securedlink/CODE109/468×60/bh_468x60_05.gif”></script>

  • BODY SECTION:

The <body> and </body> tags identify the start and end of the body section. This section includes material to be displayed on web page. Moreover this section includes information about layout of web page.

<script type=”text/javascript” src=”http://www.bluehost.com/src/js/securedlink/CODE108/468×60/bh_468x60_02.gif”></script>

HTML Files Titles:

This example result will open a HTML document in your browser with a title: “Website-School/HTML Basics example 1”. Moreover it will contain some text in its body section using <p>….</p> tag. This tag is explained in HTML Paragraph chapter.

<html>

 

<head>

<title>Website-School/HTML Basics example 1</title>

</head>

 

<body>

<p> This text is displayed using paragraph tags inside the body tags.</p>

</body>

 

</html>

<a href=”http://secureabc.maverick66.hop.clickbank.net”><img src=”http://www.maverickmoneymakers.com/affiliates/banners/mavmoney-468×60.gif”></a>

 

For more visit next posts in this category.To go back to Contents of this tutorial: Contents of HTML Tutorial

Designing a website

Designing a website:

Think! how you will feel when you will own your own website or blog. You will be able to share all the information that you have piled up in your brain. Moreover you will feel the freedom of writing.

You can write anything and send your message across the world. You can tell people about new fashion trends, technology news, market your product, buy and sell goods, etc. Does it feel good?

Hell YES…

Designing a website seems like an exhausting task. But in fact it is not as scary as people think. People with some knowledge about programming languages can easily design their own website. Even those who don’t know anything about HTML, XHTML etc. can also design a website using different special software. e.g. Dreamweaver CS4, WordPress (for blogs) etc.

Creativity is one of the major abilities that everyone has deep inside them. But only few can use this ability in an effective manner. It is a talent and cannot be learned. Building a website is not difficult at all. But yes building an attractive website is extremely difficult. So use your creativeness effectively while designing a website.

Writing skills are as important as creativity. Excellent choice of topic and writing can increase visits on your site tremendously. The more your writing is inspiring the more it attracts people to visit your site again and again. But it does not mean that those who don’t have superb writing skills cannot make a site. Such people should start practicing by making a simple website. Then by time I am sure they will acquire the required level of writing skills. Then they can also make their site rank high.

All in all, don’t worry and start working on creating your own website. This site includes all the basic tutorials, information and tips that you will need to build an extraordinary website.