HTML Lists and Attributes

HTML Lists
The HTML lists are ordered and unordered lists:

An ordered list

1. First
2. Second
3. Third

An unordered list

• First
• Second
• Third

HTML Unordered Lists

<ul>

<li>Ram</li>

<li>Shyam</li>

</ul>

How this code looks in a browser:

• Ram
• Shyam

HTML Ordered Lists

<ol>

<li>Ram</li>

<li>Shyam</li>

</ol> 

How this code looks in a browser:

1. Ram
2. Shyam

HTML Definition Lists 

A definition list is below

<dl>

<dt>Ram</dt>

<dd>- is a good boy</dd>

<dt>Shyam</dt>

<dd>- is a bad boy</dd>

</dl> 

How this code looks in a browser:

Ram

     - is a good boy

Shyam

     - is a bad boy

HTML Images and Attribute

HTML Images
Example

HTML Images - The <img> Tag and the Src Attribute.
The <img> tag is empty, which means that it contains attributes only, and has no closing tag.

Example
<img src="url" alt="some_text"/>

HTML Images - The Alt Attribute
<img src="boat.gif" alt="Big Boat" />

HTML Images - Set Height and Width of an Image
<img src="pulpit.jpg" alt="Pulpit rock" width="304" height="228" />


HTML Image Tags:-
<img /> : Defines an image
<map> : Defines an image-map
<area /> : Defines a clickable area inside an image-map

HTML -- link syntax

HTML Link Syntax
It looks like this:

Example
<a href="url">Link text</a>
<a href="http://www.ideasinweb.blogspot.com">www.ideasinweb.blogspot.com/</a>
<a href="http://www.ideasinweb.blogspot.com" target="_blank">www.ideasinweb.blogspot.com</a>

HTML Links - The name Attribute
The name attribute specifies the name of an anchor.

Example
A named anchor inside an HTML document:
<a name="tips">ideasinweb.blogspot</a>

Create a link to the "Useful Tips Section" inside the same document:
<a href="#tips">ideasinweb.blogspot</a>

Or, create a link to the "Useful Tips Section" from another page:
<a href="http://www.ideasinweb.blogspot.com/html_links.htm#tips">ideasinweb.blogspot</a>

HTML - - paragraphs and line breaks

HTML Paragraphs
Paragraphs are defined with the <p> tag.

Example
<p>This is a paragraph</p>
<p>This is another paragraph</p>

Don't Forget the End Tag
Most browsers will display HTML correctly even if you forget the end tag:

Example
<p>This is a paragraph
<p>This is another paragraph

HTML Line Breaks
Use the <br /> tag if you want a line break (a new line) without starting a new paragraph. The <br /> element is an empty HTML element. It has no end tag. Write <br> or <br />.

Example
<p>This is<br />a para<br />graph with line breaks</p>

HTML - heading, line, comment tag

HTML Headings
Headings are important in HTML documents.
Headings are defined with the <h1> to <h6> tags.

Example
<h1>This is a heading</h1>
<h2>This is a heading</h2>
<h3>This is a heading</h3>

HTML Lines
The <hr /> tag creates a horizontal line in an HTML page.

Example
<p>This is a paragraph</p>
<hr />
<p>This is a paragraph</p>
<hr />
<p>This is a paragraph</p>

HTML Comments
Comments are written like this:

Example
<!-- This is a comment -->