Java and HTML: The Basics
Before going any further lets start with the basics of
HTML first. In this section we will come to know about all the tags which are
required for the applet to be displayed within the browser. HTML provides a tag that enables the developer
to "embed" the applet within the page. This tag is known as the APPLET tag.
HTML Tags
- HTML tags are used to mark-up HTML elements
- HTML tags are surrounded by the two characters < and >
- The surrounding characters are called angle brackets
- HTML tags normally come in pairs like <b> and </b>
- The first tag in a pair is the start tag, the second tag is the end tag
- The text between the start and end tags is the element content
- HTML tags are not case sensitive, <b> means the same as <B>
HTML Elements
Recall the HTML example from the previous previous section:
<html>
<head>
<title>Title of page</title>
</head>
<body>
This is my first homepage. <b>This text is bold</b>
</body>
</html>
Now lets see what are HTML elements:
<b>This text is bold</b>
The HTML element starts with a start tag <b> and ends with </b> tag.
The content of the HTML element is: This text is bold
The <b> tag is used to define an HTML element that should be displayed as bold.
Another HTML element is:
<body>
This is my first homepage. <b>This text is bold</b>
</body>
This HTML element starts with the start tag <body> and ends with the end tag </body>.
Here the <body> tag defines the HTML element that contains the body of the HTML document.
Setting Up the Title: The <HEAD> and the <TITLE> Tags
We have already learned that how to use the <HEAD> and the <TITLE> Tags
to display the information on the document. However, I would like to tell you
that the browser starts processing the HTML document when it sees the <HTML>
tag. Furthermore, we use the HEAD tag after the HTML tag which contains the information
though the information doesn't appear directly on the page.
However, any information which we insert in the TITLE tag gets displayed on the
blue bar of the Web browser. As shown below.
<HTML>
<HEAD>
<TITLE>This is my first homepage!</TITLE>
</HEAD>
</HTML>
The <BODY> Tag
Now lets add a little bit of more information
to our document. For this we will use BODY tag as you are already familiar with.
As shown below.
<HTML>
<HEAD>
<TITLE>This is my applet's first home!</TITLE>
</HEAD>
<BODY>
</BODY>
</HTML>
Well the above HTML code will display a blank screen. To
make the text more live we use number of HTML tags. The two most commonly used tags are the
heading tags and paragraph tags which are described
below.
Headings
As by the name headings always appear at the
top of any any text or paragraph. There are six levels of headings in HTML.
These headings are defined with the <h1> to <h6> tags. The <h1> defines the largest
heading and <h6> defines the smallest heading. The tags are given below.
<h1>This is a heading</h1>
<h2>This is a heading</h2>
<h3>This is a heading</h3>
<h4>This is a heading</h4>
<h5>This is a heading</h5>
<h6>This is a heading</h6>
NOTE : HTML automatically adds an extra blank line before and after a heading.
<html>
<head>
<title>HTML Heading Example</title>
</head>
<body>
<h1>This is Heading 1</h1>
<h2>This is Heading 2</h2>
<h3>This is Heading 3</h3>
<h4>This is Heading 4</h4>
<h5>This is Heading 5</h5>
<h6>This is Heading 6</h6>
</body>
</html>
|
Output for the above code:
Paragraphs
One of the most common tags used to contain regular text in HTML is the
paragraph tag. The <p> tag is used to insert a paragraph as shown below.
<p>This is a paragraph</p>
<p>This is another paragraph</p>
<html>
<head>
<title>This is my applet's first home!</title>
</head>
<body>
<p>You are learning html.</p>
<p>This is the paragraph.</p>
</body>
</html>
|
Output For The Above HTML Code:
Line Breaks
The <br> tag is used for line break. This
tag is used to end a line i.e. to end a line without starting a new paragraph. The <br> tag forces a line break wherever you place it.
They have no ending tag because they do not actually contain anything. The <br> tag is an empty tag. It has no closing tag.
<p>My <br> new page<br> with line breaks</p>
<html>
<head>
<title>Breaking a line</title>
</head>
<body>
<p>Let us break<br/>the line.</p>
</body>
</html>
|
Output For The Above HTML Code:
Comments in HTML
To explain your code, you can use comments which can help you when you edit the source code at a
some time later. To insert a comment in the HTML source code, the comment tag is used.
However a comment gets ignored by the browser. For instance.
<!-- This is a comment -->
Remember, to put an exclamation point after the opening bracket, but not before the closing bracket.
|
Del.icio.us
Digg
Google
Spurl
Blink
Furl
Simpy
Y! MyWeb
