Scribd
Upload
4 views

02 - HTML Intro

The document provides an overview of HTML elements related to backgrounds, linking, text alignment, lists, text formatting, font size and color, images, and character entities. It explains how to use attributes like bgcolor and background for setting backgrounds, the anchor tag for linking to other pages, and various list types. Additionally, it covers text formatting options and character entities for displaying special characters in HTML.

Uploaded by

abdullahrashid359
Copyright
© © All Rights Reserved
Available Formats
Download as PPT, PDF, TXT or read online on Scribd
4 views

02 - HTML Intro

The document provides an overview of HTML elements related to backgrounds, linking, text alignment, lists, text formatting, font size and color, images, and character entities. It explains how to use attributes like bgcolor and background for setting backgrounds, the anchor tag for linking to other pages, and various list types. Additionally, it covers text formatting options and character entities for displaying special characters in HTML.

Uploaded by

abdullahrashid359
Copyright
© © All Rights Reserved
Available Formats
Download as PPT, PDF, TXT or read online on Scribd
You are on page 1/ 15

HTML Backgrounds

The <body> tag has two attributes where you can specify backgrounds. The
background can be a color or an image.

bgcolor

The bgcolor attribute specifies a background-color for an HTML page. The


value of this attribute can be a hexadecimal number, an RGB value, or a
color name:
<body bgcolor="#000000">
<body bgcolor="rgb(0,0,0)">
<body bgcolor="black">

background

The background attribute specifies a background-image for an HTML page.


<body background="clouds.gif">
Linking to Another Web-Page

Anchor Tag and href attribute


The <a> tag is used to create an anchor to link from and
href attribute is used to address the document to link to,
and the words between the open and close of the anchor
tag will be displayed as a hyperlink.

<a href="url">Text to be displayed</a>


Example:
<a href="http://www.gmail.com/">Visit G-Mail</a>
Linking to Another Web-Page

Anchor Tag and target attribute


With the target attribute, you can define where the linked
document will be opened.
The line below will open the document in a new browser
window:

<a href="http://www.google.com/" target="_blank">


Visit Google
</a>
Linking B/W Your Own Page
 If you want to create a link from one page to another
page on the same computer.

<a href=“text.html">Text File is Here.</a>

 You can also use an image as a link:

<a href="lastpage.htm">
<img border="0" src="buttonnext.gif" width="65“>
</a>
E-Mail Link on Your Page
You can add your E-Mail address on your web-page, so
that your reader can reply/feed-back while visiting your
page. This is the simply way to enable readers of your
web-pages to “talk back” to you.

<a href=“mailto:[email protected]”> Send me an E-Mail


</a>
Text Alignment
 The align attribute allows you to left-justify, right-justify or center
text.

<p align=“left”>
I love Pakistan.<br />
I love Pakistan.<br />
I love Pakistan.<br />
</p>
HTML Lists
Unordered Lists
An unordered list starts with the <ul> tag. Each list item starts
with the <li> tag.
<ul>
<li>Coffee</li>
<li>Milk</li>
</ul>

Output:
• Coffee
• Milk
HTML Lists
Ordered Lists
An ordered list starts with the <ol> tag. Each list item starts
with the <li> tag.
<ol>
<li>Coffee</li>
<li>Milk</li>
</ol>
Output:
1. Coffee
2. Milk
HTML Lists
Definition Lists
Definition lists are indented lists without any number or symbol in front of
each item.
<dl>
<dt>Coffee</dt>
<dd>Black hot drink</dd>
<dt>Milk</dt>
<dd>White cold drink</dd>
</dl>

Output:
Coffee
Black hot drink
Milk
White cold drink
Text Formatting
<b>This text is bold</b>

<strong> This text is strong </strong>

<big> This text is big </big>

<em>This text is emphasized</em>

<i>This text is italic</i>

<small>This text is small</small>

This text contains <sub>subscript </sub>

This text contains <sup> superscript


</sup>
Font Size and Color
The <big>, <small> and etc. gives you some rudimentary
control over the size and appearance of the text on your
page.
For more control and size on the appearance of your text
you can use <font> in HTML.

<font size=“5” face= “arial” color=“purple” >This


text will be big and purple </font>
HTML Images
 The Image Tag and the Src Attribute

<img src="url" />

<img src=“E:\clouds.jpg" />


HTML Character Entities
Some characters have a special meaning in HTML. If we
want the browser to actually display these characters we
must insert character entities in the HTML source. A
character entity has three parts:
1. an ampersand (&)
2. an entity name
3. # and an entity number, and finally a semicolon(;).

To display < in an HTML document we write: &lt; or &#60;


Name instead of a number is easier to remember.
Not all browsers support the newest entity names.
Note: that the entities are case sensitive.
Most Common Character Entities
Commonly Used Character Entities

You might also like