Web Programming Unit 3 – Basic Tags in HTML Presentation 3
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Web Programming
Unit 3 – Basic Tags in HTML
Presentation 3
Objectives
At the end of this presentation, you will be able to• Add special characters to your Web page• Attract the users by adding colours and
background pictures to your Web page
Character Entities
• To represent the characters, such as < and >, the Entity references are used.
•The Entity references have 3 parts. They are:
•The leading ampersand (&) symbol,•An entity name and•The Semicolon (;)
•For example, to display <HTML> in a Web page the code is <HTML>
Character Entities
• Entity References
Lab Exercise
14. Open D3_5.html in Internet Explorer.
a. Identify the entity reference which is used for Copyright symbol?
b. Identify the entity reference for Plus or Minus symbol.
c. Find out the entity reference for Trade Mark symbol.
d. What entity reference is used for Register symbol?
e. Identify the symbol for Ampersand.
Lab Exercise
15. Write a HTML code to display the output as given in the following figure using character entities.
Activity 2.3.1
• Create a Web page that explains the heading tags as shown in Figure.
• Save the HTML file as Activity1.HTML in C:\HTML\Unit 3\Activity folder.
Activity 2.3.2
• Create a Web page that explains the use of <BR> tag and <P> tag as shown in Figure.
• Save the HTML file as Activity2.HTML in C:\HTML\Unit 3\Activity folder.
Colour Values and Name
• BGCOLOR attribute of the <BODY> tag specifies the background colour of the page.
• The Colour can be specified in the form Colour values or Colour names.
RED FF0000
GREEN 00FF00
BLUE 0000FF
YELLOW FFFF00
CYAN 00FFFF
MAGENTA FF00FF
BLACK 000000
WHITE FFFFFF
GRAY 808080
Colour Values and Name
• Background attribute of the <BODY> tag specifies the background picture of the page.
• Example:<BODY BACKGROUND=”c:\Internet.jpg”>
Lab Exercise
16. Open D3_6.html in Internet Explorer. a. View the source code in notepad.b. Identify the tag which is used to change
the background and text colour of the above Web page?
c. Change the background colour to pink and text colour to black.
d. Save the file and view the output in the browser.
Lab Exercise
17.Open Welcome.html, add background attribute into the <BODY> tag and display the output as given in the following figure. Save the file and view the output in the browser.
Lab Exercise
18. Write a HTML code to display the output as given in the following figure using <H1>,<BODY> <HR> and <MARQUEE> and save the file as Malaysia.html and view the output in the browser.
Activity 2.3.3
• Create a Web page that explains the use of comment and <HR> tag as shown in Figure. Add comments in your HTML file.
• Save the HTML file as Activity3.HTML in C:\HTML\Unit 3\Activity folder.
Activity 2.3.3 Contd.
Activity 2.3.4
• Create a Web page with the content given below. The conditions you have to follow while creating the Web page is given within brackets.
• Save the HTML file as Activity4.HTML in C:\HTML\Unit 3\Activity folder.
Activity 2.3.5
• Create a Web page that explains the structure of HTML document as shown in Figure. The continuation of the page is shown in Figure.
• Save the HTML file as Activity5.HTML in C:\HTML\Unit 3\Activity folder.
Summary
In this presentation, you learnt the following:• Entity references are the symbolic
representation of the characters.• Bgcolor attribute of <BODY> tag specifies
the background color of the page.• Background attribute of <BODY> tag
specifies the background picture of the page.
Assignment
I. Solve the following crossword:
Assignment
• Across
6. Attribute of <MARQUEE> tag to scroll the text to and fro in the scrolling area.
8. To draw a horizontal line.
9. Attribute to specify the number of times
to scroll.
10. Character entity name to display the ¥
symbol.
Assignment
• Down
1. To scroll across the browser window.
2. Name of character entity to leave space.
3. Use of <P> tag.
4. Attribute of <MARQUEE> tag to
specify the direction of scrolling.
5. Character entity reference ends with
this.
7. To print in the next line.
Related Documents
