Note: Make a New Folder in E: or D: with your name and make seperate notepad file for each practical's.
Practical No.1
Write HTML code in Notepad to develop a web page having title "Welcome to my homepage" and text in red color.
-----------------------------------------------------------------------------------------------------------------------------
Practical No.2
Write HTML code in Notepad to develop a web page of topic of your choice using the basic tags. Add bold and italic words. Add a header, paragraph and break tags to your document. Add a horizontal rule where appropriate.
-----------------------------------------------------------------------------------------------------------------------------
Practical No.3
Write HTML code in Notepad to develop a web page having heading with bold and underline and make list of 5 persons name with different font color.
-----------------------------------------------------------------------------------------------------------------------------
Practical No.4
Write HTML code in Notepad to develop a web page giving details of your name, age, telephone, address and roll number.
-----------------------------------------------------------------------------------------------------------------------------
Practical No.5
Write HTML code in Notepad to develop a web page of your favorite teacher. Design the page with an attractive text fonts, colors and background image.
-----------------------------------------------------------------------------------------------------------------------------
Practical No.6
Write HTML code in Notepad to develop a web page of topic of your choice. Design the page with an attractive color combination with suitable heading, fonts and horizontal lines.
-----------------------------------------------------------------------------------------------------------------------------
Practical No.7
Write HTML code in Notepad to create a following webpage
1. Create a bold heading "Generations of Computer"
2. Display an image in 250x175 pixel below the heading.
3. Display following text below the image.
Computer Generations
- First
- Second
- Third
- Fourth
- Fifth
-----------------------------------------------------------------------------------------------------------------------------
Practical No.8
Write HTML code in Notepad to perform the following tasks.
a. Display the text 'Generations of Computer' in heading 2 format and insert a horizontal line below it.
b. Create and ordered list. The list items should be First Generation, Second Generation, Third Generation, Fourth Generation and Fifth Generation.
c. Insert an image whose width should be 300 pixels and height 200 pixels.
-----------------------------------------------------------------------------------------------------------------------------
Practical No.9
Write HTML code in Notepad to create a web page about the course details of a college.
ABC Information Technology College
Blue Area, Islamabad.
Course Details:
1. Complete Course
a. Basic Computer Training
b. Diploma in Computer Application
2. Crash Courses
- Accounting Course
- E-banking Course
3. Other Courses
i. Secretariat Training
ii. Photography Training
For more details: visit abccollege.compk
Create a link for abccollege.com.pk
-----------------------------------------------------------------------------------------------------------------------------
Practical No.10
Write HTML code in Notepad to create a following web page.
Apply Heading 3 for the text "List of Useful Website". Insert a horizontal line after heading.
List of Useful Website
- Wikipedia
- Yahoo
-----------------------------------------------------------------------------------------------------------------------------
Practical No.11
Create two web pages having backgrounds and in the first page show heading "Welcome to my site" and make hyperlink to "Click here to see my details" when click in display the second page. In second page show your bio data and photo with border.
-----------------------------------------------------------------------------------------------------------------------------
Practical No.12
Create two html file. On the first file display topic of your choice and make an hyperlink "Click here to read further" so that it will take you to the second file if clicked. Display text on second file and it should go to the first file if the picture is clicked.
-----------------------------------------------------------------------------------------------------------------------------
Practical No.13
Write HTML code in Notepad to create a web page and make the following table
-----------------------------------------------------------------------------------------------------------------------------
Practical No.14
Create the following HTML document using Notepad.
-----------------------------------------------------------------------------------------------------------------------------
Practical No.15
Show your "Personal Information" using HTML Table, Image and Background
-----------------------------------------------------------------------------------------------------------------------------
Practical No.16
Create the following HTML table using Notepad.
-----------------------------------------------------------------------------------------------------------------------------
Practical No.17
Write HTML code in Notepad containing following format of Table.
---------------------------------------------------------------------------------------------------------------------------
Practical No.18
Construct the following Web document using HTML.
---------------------------------------------------------------------------------------------------------------------------
Practical No.19
Write HTML code in Notepad to make a following frame-set web page.
-----------------------------------------------------------------------------------
Practical No.20
Create a HTML web page for a restaurant with three frames. The first frame will be horizontal on displaying the name and address of restaurant. Second frame which is vertical on left will list the available food items. The third frame will be to the right of second frame and will display the introduction to the restaurant.
-----------------------------------------------------------------------------------
Practical No.21
Write down the html code for the following frames.
-----------------------------------------------------------------------------------
Practical No.22
Write down the html code for the following frames.
-----------------------------------------------------------------------------------
Practical No.23
Write down the html code for the following frames.