Fatema Abbas Portfolio

Practical # 1
Objective: 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, paragraphing break tags to your document. Add a
horizontal rule where appropriate.
Coding:
<html>
<head>
<title>
Founder of Pakistan
</title>
</head>
<body>
<h1>
<b> Quaid-e-Azam </b>
</h1>
<p>
Quaid-e-Azam Mohammad Ali Jinnah was the founder of our beloved country Pakistan.He was
born on <b> <i> 25th December, </i></b> 1867 in Karachi. His father
name was Jinnah poonja. He received his early education from Karachi then he went to England
and took his Barrister's degree from Linchon's Inn.
</p>
<br>
<p>
After completing his education he came back to India and started law-practice. First he joined
Indian National Congress but soon left it and joined the <b>
All India Muslim League </b> in 1922.People gave him the the title of Quaid-e-Azam for his
selfless service for the creation of Pakistan. He was a man of discipline.
</p>
<br>
<p>
From 1940 till his death on <b> <i> 11th september,1948 </i></b> Quaid-e-Azam worked day
and night for the creation and prosperity of Pakistan. It was due to
his untiring efforts and wise leadership that a separate state for the Muslim of South Asia was
came into being on 14th August,1947.
</p>
<br>
<br>
<p>
Quaid-e-Azam became the first Governor General of Pakistan but died after thirteen months of
the creation of Pakistan. He is buried under his tomb in Karachi.
</p>
</body>
</html>
Output:
Practical # 2
Objective: write a html code of your own choice. Design the page with an attractive color
combination, with suitable headings, fonts and horizontal rules.
Coding:
<html>
<head>
<title>computer Science</title> </head>
<body>
<h1><font color = "darkred">Comupter Science</font>
<h2><font color = "#8000ff"><b>Introduction to Computer Science</b></font></h2>
<p><font size="4"color="#bf00ff">Computer Science (CS) is a multifaceted discipline that
encompasses the study of
computers, computational systems, and the algorithms that drive them. It is a field characterized
by innovation, problem-
solving, and the exploration of new frontiers in technology. At its core, computer science seeks
to understand and harness
the power of computing to address real-world challenges and enhance human
endeavors.</font></p>
<hr>
<h2><font color = "purple"><b>The Significance of Computer Science</b></font></h2>
<p><font style="Un Shinmun"size="4.5"color=" #cc007a">In today's digital age, computer
science plays a pivotal role in nearly every aspect of modern life. From the smartphones
in our pockets to the sophisticated algorithms powering online search engines, computer science
underpins much of the
technology we interact with daily. It drives innovation in fields as diverse as healthcare, finance,
education,
entertainment, and transportation, shaping the way we work, communicate, and live.</font></p>
<hr>
<h2><font color = "purple"><b>Applications of Computer Science</b></font></h2>
<p><font size="4.5"color="#ff61a7">Computer science has diverse applications across
numerous fields, including:
Software Development: Creating applications, websites, and systems to meet specific user needs
and business objectives.
<br><b>Artificial Intelligence (AI):</b> Developing algorithms and systems that exhibit

human-like intelligence, such as
machine learning, natural language processing, and computer vision.

<br>
<b>Data Science:</b> Analyzing and extracting insights from large datasets to inform decision-
making and drive innovation.
<br>
<b>Cybersecurity:</b> Protecting computer systems, networks, and data from unauthorized
access, cyberattacks, and
breaches. </font></p>
</body>
</html>
Output:
Practical # 3
Objective: Write HTML code in Notepad to create the following Web Page.
1. Create a bold heading of Types of Computers
2. Display the types of computers in an unordered list format
Coding:
<html>
<head><title>unordered list</title></head>
<body>
<h2>Types of Computers</h2>
<ul>
<li>Microcomputers</li>
<li>Minicomputers</li>
<li>Mainframes</li>
<li>Supercomputers</li>
</body>
</html>
Output:
Practical # 4
Objective: Write HTML code in Notepad to create the following Web Page.
1. Create a bold heading of Types of Secondary memory
2. Display the types of Secondary memory in an ordered list format
Coding:
<html>
<head><title>ordered list</title></head>
<body>
<h2>Types of Secondary Memories</h2>
<ol>
<li>Hard disk</li>
<li>CD and DVD</li>
<li>USB Flash Drive</li>
<li>Memory Cards</li>
</body>
</html>
Output:
Practical # 5
Object: Write HTML code in Notepad to create the following Web Page.
1. Create a bold heading of Types of Networks
2. Display the types of Networks in definition list format
Coding:
<html>
<head>
<title> Definition List </title>
</head>
<body>
<dl>
<dt> <b> Local Area Network </b> </dt>
<br>
<dd> Local Area Network (LAN) is the most common type of network. It is a network that spans
a limited physical area, usually ranging from a small office to a campus of buildings. A LAN
uses high-speed wired or wireless connections between the computers. </dd>
</br>
<br>
<dt> <b> Wide Area Network </b> </dt>
</br>
<br>
<dd> When a network covers a larger area, making it impractical to wire computers together
with high-speed communication lines, it becomes a Wide Area Network (WAN). A WAN spans
a large physical area, connecting several sites of an organization across cities, countries and
continents. </dd> </br>
</dl>
</body>
</html>
Output:
Practical # 6
Objective:
Coding:
<html>
<head><title>courses list</title></head>
<body>
<h1>ABC Information Technology College</h1>
<h3>Blue Area, Islamabad</h3>
<ol>
<li>Complete Course</li>
<ol type="a">
<li>Basic Computer Training</li>
<li>Diploma in Computer Application</li>
</ol>
<li>Crash courses</li>
<ul type="circle">
<li>Basic Computer Training</li>
<li>Diploma in Computer Application</li>
</ul>
<li>Other Courses</li>
<ol type="i">
<li>Secretariat Training </li>
<li>Photography Training</li>
</ol>
For more details: visit <a href="www.abccollege.com.pk">www.abccolloege.com.pk</a>
</body>
</html>
Output:
Practical # 7
Objective: Write HTML code in Notepad to create a web page.

1. Display the bold heading of Types of Network Topologies.
2. Display the text with the sub-heading of each kind of topologies, their advantages and
limitations in ordered list.
3. Insert an image of each topology along with their headings and text.
Coding:
<html>
<head>
<title> Network Topologies </title>
</head>
<body>
<h1> <font color = "blue"> TYPES OF NETWORK TOPOLOGIES </font> </h1>
<p> Four types of network topologies are commonly used which are bus, ring, star and mesh.
</p>
<h3> <font color = "pink"> Bus topology </font> </h3>
<p> It is the simplest network topology. It consists of a single central cable known as a bus. All
the devices are connected to the bus along its length to communicate with each other as shown
in Fig. A computer sends a message on the bus. The computer to whom the message is sent
receives it while others ignore it. At each end of bus, a device called terminator is attached so
that the signals do not bounce back on the bus causing errors. </p>
<h3> <font color = "blue"> Advantages of Bus Topology </font> </h3>
<ol>
<li> Lowest cost topology to implement due to short cable length. </li>
<li> Easy to add new computers </li>
<li> Easy to setup as compared to Star or Mesh Topology. </li>
<li> Suitable for small networks. </li>
</ol>
<h3> <font color = "blue"> Limitations of Bus topology </font> </h3>
<ol>
<li> If a bus is damaged at any point, the entire network stops working. </li>
<li> Difficult to detect and fix faults </li>
</ol>
<img src = "bus topology.png" height = "200" width = "300" length = "150" border = "
2"alt="bus topology">
<h3> <font color = "pink"> Ring Topology </font> </h3>
<p> The ring network topology is shaped just like a ring as shown in Fig. It is like a bus with both
ends connected together. All the messages travel in the same direction. Messages from one
node is sent to the next node. It is received by it if it is addressed to it otherwise it is ignored
and passed on to the next until the destination is reached. </p>
<h3> <font color = "blue"> Advantages of Ring Topology </font> </h3>

<ol>
<li> High network performance. </li>
<li> Server or switch is not required to manage the network. </li>
<li> All the computers have equal opportunity to transmit data. </li>
</ol>
<h3> <font color = "blue"> Limitations of Ring Topology </font> </h3>
<ol>
<li> If the ring is broken at any point, the entire network stops functioning. </li>
<li> Detection of fault is difficult. </li>
<li> If any computer in the ring is not working the whole network is affected. </li>
<li> Expansive than Star and Bus topologies. </li>
</ol>
<img src = "ring topology.jpg" height = "200" width = "300" length = "150" alt="ring topology">
<h3> <font color = "pink"> Star Topology </font> </h3>
<p> In star topology all the nodes are connected to a central device called switch or hub as
shwon in Fig. It is a one of the commonly used network topologies. A switch can connect 4, 8,
16, 24 or 32 nodes. A switch can be connected to another switch to expand the network. </p>
<h3> <font color = "blue"> Advantages of Star Topology </font> </h3>
<ol>
<li> Provides fast communication between computers. </li>
<li> Easy to connect new devices to the network. </li>
<li> Easy to detect and fix faults. </li>

<li> Failure of one computer does not stop functioning of the entire network. </li>
</ol>
<h3> <font color = "blue"> Limitations of Star Topology </font> </h3>
<ol>
<li> At least one switch/hub is required for connecting two computers. </li>
<li> Lengthy cable is required to connect all the computers to the switch. </li>
<li> Costly to implement </li>
</ol>
<img> <img src = "star topology.png" height = "200" width = "300" length = "150" border = "
2"alt="star topology">
<h3> <font color = "pink"> Mesh Topology </font> </h3>
<p> In mesh topology, all the network nodes are connected to all the other nodes as shown in
Fig. Message sent on a mesh network, can take any possible path from source to destination. It
is not commonly used since it is costly and difficult to implement. </p>
<h3> <font color = "blue"> Advantages of Mesh Topology </font> </h3>
<ol>
<li> It is the most reliable network topology </li>
<li> Alternative paths are available in case a path is broken from source to destination </li>
</ol>
<h3> <font color = "blue"> Limitations of Mesh Topology </font> </h3>
<ol>
<li> Most expensive topology to implement since it requires more cable then Bus, Ring or Star
topologies. </li>
<li> Difficult to implement as compared to other topologies. </li>
<li> Difficult to add new computer. </li>
</ol>
<img> <img src = "mesh topology.png" height = "200" width = "300" length = "150" border = "2"
alt="mesh topology">
</body>
</html>
Output:
Practical # 8
Object:
Write HTML code in Notepad to develop a web page of your favourite teacher. Design the page
with an attractive text fonts, colors and background image.
Coding:
<html>
<head>
<title>my favourite teacher</title>
</head>
<body background = "img.jpg" >

<font color = "#FF0000"><h1>My favourite teacher</h1></font>
<h2><font color = "magenta"size="6"><b>Miss zainab</b></font></h2>

<font size = "4.5"color="#ad53b5">Introducing our remarkable teacher, Miss zainab, showcases
a unique blend of wisdom and contemporary mindset that resonates deeply with us, her students.
While she may not be as young as some of us, her spirit and outlook on life are timeless,
reflecting a mindset that's both empathetic and resilient.
she exemplifies resilience in every aspect of her life, from her personal challenges to her
professional ones. Despite facing numerous obstacles along her journey, she's stronger and more
determined, setting an inspiring example for us all.</font></p>
</body>
</html>
Output:
Practical # 9
Objective: Write HTML code in the notepad to create a webpage as follows:
Apply heading for the text “List of Useful Website.” Insert a horizontal line after heading.
List of Useful Website
Google
Wikipedia
YouTube
Shirteez
<html>
<head>
<title> Useful Websites </title>
</head>
<body>
<h3> LIST OF USEFUL WEBSITES </h3>
<p><a href="https://www.google.com/">Google</a><br>
<a href="https://www.youtube.com/">Youtube</a><br>
<a href="https://www.wikipedia.org/">Wikipedia</a> <br>
<a href="https://shirteez.pk/">Shirteez</a></p>
</body>
</html>
Output:
Practical # 10
Object:
Create two web pages having background and in the the first page show heading "Welcome to
my site" and make hyperlink to "click here to see my details" when click is in display the second
page show your bio data and photo with border. Your Bio data should include Name: Age:
Address: School: Class: Gr Number: Mobile Number: Favorite Hobby: Favorite Books: etc.
Html 1st page coding:

<html>
<head>
<title>Home Page</title>
</head>
<body background="abstract bg.jpg" alt="bg image">
<h1>Welcome to my site</h1>
<a href=” click here to see my details”>Click here to see my details</a>
</body>
</html>
HTML 2nd page coding:

<html>
<head>
<title>Bio Data Page</title>
</head>
<body background="abstract bg.jpg" alt="bg image">
<body>
<p>
Name: fatema abbas
<br>
Age:15
<br>
Address: North Nazimabad
<br>
school: Badri high school
<br>
Class: 9
<br>
Gr Number: 5899<br>
Mobile No:03222838442 <br>
Favorite Hobby: Sleeping <br>
Favorite Books: romeo and juliet<br>
<a href="fatimaprc10.html">Go Back </a>
</p>
</body>
</html>
Output:
Practical # 11
Objective:
Create three html files. On the first file display the following The heading of "Transmission
Media" and types of Transmission media and make it an hyperlink so that it will take you to the
second file and third file when clicked. Display the text on the second file and it should go to the
first file if the image is clicked. Similarly for the third file as well. The second page should have
the information related to guided media The third page should have the information related to
unguided media
Coding:
First Page:
<html>
<head><title>Transmission Media</title></head>
<body>
<h1>Transmission Media</h1>
<p>Transmission media provide the means by which data travels from source to destination. In
other words, it is the pathway for transmitting data</p>
<h2> Types of Transmission Media </h2>
<p> There are two types of transmission media: </p>
<ol>
<li>
<a href="Guided Media.html">Guided Media </a> </li>
<li>
<a href="Unguided Media.html">Unguided Media </a></li>
</ol>
</body>
</html>
Page 2:
Guided Media:
<html>
<head><title> Transmission Media 2 </title></head>
<body>
<h1>Guided Media </h1>
<p>
Guided Media uses a cabling system that guides the data signals along a specific path. Different
types of guided media are twisted pair cable, coaxial cable and Fiber optic cable.
</p>
<h2>Twisted Pair Cable</h2>
<p>
Twisted pair cable is the most commonly used cable for data communication. It consists of pairs
of copper wires twisted around one another as shown in fig.4-5. The purpose of twisting the
cables is to reduce cross talk and electromagnetic interference and make the transmission more
reliable. Telephone cable consists of 2 twisted insulated wires. Computer network cable consists
of 4 pairs of twisted cables. Transmission speed of twisted pair cable ranges from 2 million bits
per second to 10 billion bits per second.
</p>
<img src= "twisted pair.jpg" alt= "twisted pair" width="200" height="200">
<h2>Coaxial Cable </h2>
<p> Coaxial cable is used for local area networks and cable television systems. It consists of
copper wire surrounded by an insulating layer. The insulating layer itself is surrounded by a
conductive layer as shown in Fi. 4-6. Insulation reduces interference and distortion.
Transmission speed ranges from 200 million bits per second to more than 500 million bits per
second. </p>
<img src= "Coaxialcable.webp" alt="Coaxial cable" width="200" height="200">
<h2> Fiber Optic Cable </h2>
<p>Fiber optic cable consists of smooth hair-thin strands of transparent material. In fiber optic
communication, the transmitter has a converter that converts electrical signal int light waves.
These light waves are transmitted over fiber optic cable. Another converter is placed at the
receiving end that converts the light waves back to electrical signals. </p>
<p>A single Fiber optic cable can carry up to 50,000 communication lines. It provides high
quality transmission at extremely fast speed. It can transmit trillions of bits per second. It is not
affected by electromagnetic fields and can transmit both analog and digital signals. </p>
<p>Fiber optic cable is more expensive than twisted pair cable and coaxial cables. It is used for
data transmission over long distances. Fiber optic cable is shown in Fig.4-7.
</p>
<img src="Fiber cable.webp" alt="Fiber cable" width="200" height="200">
</body>
</html>
Page 3:
Unguided Media:
<html>
<body>
<h1>Unguided Media </h1>
<p>Unguided media signals travel through open space and nothing guides them along any
specific path. They do not use cables for data transmission. Unguided media can be classified
into radio waves, microwaves, infra-red and satellite communication. </p>
<h2>Radio Waves </h2>

<p> Radio waves are electromagnetic waves that are propagated by antennas. Radio transmission
consists of a transmitter and a receiver. A transmitter transmits a radio signal to the receiver
which receives it. Radio waves are used to transmit music, conversation, pictures and data. Data
can be transmitted over long distance using radio waves. These waves are invisible and
undetectable to human beings. </p>
<p> The following are some applications of radio waves. </p>
<ul>
<li>Radio and television broadcast. </li>
<img src="television broadcast.jpg" alt="television broadcast" width="250" height=
"250">
<li>Cell phones communication. </li>
<img src="cell phone communication.jpg" alt="cell phone communication" width="300"
height="150">
<li>Radio controlled toys. </li>
<img src="radio controlled.webp" alt="Radio controlled car" width="250" height="250">
<li>Satellite communication </li>
<li>Wireless networks and wireless internet. </li>
</ul>
<h2>Microwaves </h2>
<p>Microwave signals travel through open space like radio waves. Microwaves provide much
faster transmission rates than telephone lines or coaxial cables. Microwave antennas are installed
on high buildings or high towers as shown in Fig.4-11. The transmitting and the receiving sites
must be within sight of one another. Microwaves are used for satellite communication and other
long distance wireless communications. </p>
<img src="Microwave Transmission.jpg" alt="Microwave Transmission" width="300"
height="200">
<h2>Infra-red </h2>
<p> Infra-red waves are light energy that we cannot see. It travels through space at the speed of
light. It is used for short distance communication. Infra-red waves are usually used in remote
controls for television. DVD players and other similar devices. Infra-red wireless signals are
disrupted by persons or objects in between television and remote control is shown in Fig.4-12.
</p>
<img src="Infra-red communication.webp" alt="Infra-red communication" width="300"
height="250">
<h2> Bluetooth </h2>
<p> Bluetooth is a wireless communication technology that uses radio waves to connect portable
electronic devices over short distances. It eliminates the need for cable connection and provides
fast and reliable transmission. It supports networking of wide range of portable devices that work
on lo battery. These devices include mobile phone, mouse, keyboard, wireless speaker, wireless
headset, tablet, laptop computer and personal computer. Laptop computers have built-in
Bluetooth, but persona computer can use Bluetooth adapters to communicate with Bluetooth
devices. The most common use of Bluetooth is connecting a mobile phone to a wireless headset
or to a laptop computer to transfer voice data. Bluetooth technology can transmit text, image,
voice and video.
</p>
</body>
</html>
Output:
Practical # 12
Objective:
Write HTML code in Notepad to create a web page and make the following table.
Coding:
<html>
<head>
<title> Tables Colspan </title>
<style>
table, th, td {
border: 1px solid black;
border-collapse: collapse;
}
</style>
</head>
<body>
<h1> ABC Company Limited <br> Blue Area, Islamabad. </h1>
<table style=” width:100%”>

<tr>
<th> S.No. </th>

<th>Name </th>
<th>Address</th>
<th>Salary</th>
</tr>
<tr>
<td>1. </td>
<td>Raheem Butt </td>
<td>Islamabad</td>
<td>15000</td>
</tr>
<tr>
<td>2. </td>
<td>Shakeel Sheikh</td>
<td>Rawalpindi </td>
<td>17000</td>
</tr>
<tr>
<td colspan=”2”> Total</td>
<td>32000</td>
</table>
</body>
</html>
Output:
Practical # 13
Objective:
Create the following HTML document using Notepad.
Coding:
<html>
<head>
<style>
table, th, td {
}
</style>
</head>
<body>
<table style="width:50%">>
<tr>
<th rowspan="2">City</th>
<th colspan="2">population</th>
</tr>
<tr>
<th>Male</th>
<th>Female</th>
</tr>
<tr>
<td>Islamabad</td>
<td>2600000</td>
<td>1400000</td>
</tr>
<tr>
<td>Karachi</td>
<td>7600000</td>
<td>6800000</td>
</tr>
<tr>
<td>Muzaffarabad</td>
<td>800000</td>
<td>850000</td>
</table>
</body>
</html>
Output:
Practical # 14
Objective:
Construct the following Web document using HTML.
Coding:
<html>
<head>
<style>
table, th, td {
}
<title>about leaf</title>
</style>
</head>
<body>
<p><h3><i><b><center>About leaf</center></b></i></h3></p>
<table style="width:50%">>
<tr>
<th>Leaf</th>
<th>Description</th>
</tr>
<tr>
<td><img src="brown.png"></td>
<td>It is a leaf of brown color which is incredibly beautiful and used in different kind of
decoration</td>
</tr>
<tr>
<td><img src ="leaf.png"> </td>
<td>it is a green color which is rarely found in place where there is spring type of
weather</td>
</tr>
<tr>
<td><img src ="yellow.png"> </td>
<td>it is a yellow color which is before winter season </td>
</tr>
</table>
</body>
</html>
Output:
Practical # 15
Objective: Create an HTML file creating a timetable of your class. Using the background
color for different rows
Coding:
<html>
<head>
<style>
table, th, td {
}
tr:nth-child(even) {
background-color: rgba(150, 212, 212, 0.4);
}
th:nth-child(even),td:nth-child(even) {
background-color: rgba(150, 212, 212, 0.4);
}
</style>
</head>
<body>
<h2>TIMETABLE</h2>
<table style="width:50%">
<tr>
<th colspan="10">9A</th>
<tr>
<th>days</th>
<th>1</th>
<th>2</th>
<th>3</th>
<th>4</th>
<th rowspan="6">break</th>
<th>5</th>
<th>6</th>
<th>7</th>
<th>8</th>
</tr>
<tr>
<td>mon</td>
<td>pt</td>
<td>pt</td>
<td>chem</td>
<td>chem</td>
<td>maths</td>
<td>phy</td>
<td>comp</td>
<td>comp</td>
</tr>
<tr>
<td>tue</td>
<td>isl</td>
<td>urdu</td>
<td>urdu</td>
<td>din</td>
<td>maths</td>
<td>phy</td>
<td>comp</td>
<td>pst</td>
</tr>
<tr>
<td>wed</td>
<td>pst</td>
<td>pst</td>
<td>chem</td>
<td>chem</td>
<td>maths</td>
<td>eng</td>
<td>comp</td>
<td>urdu</td>
</tr>
<tr>
<td>thr</td>
<td>pst</td>
<td>eng</td>
<td>din</td>
<td>chem</td>
<td>maths</td>
<td>phy</td>
<td>isl</td>
<td>comp</td>
</tr>
<tr>
<td>fri</td>
<td>pst</td>
<td>pst</td>
<td>chem</td>
<td>chem</td>
<td>maths</td>
<td>phy</td>
<td>isl</td>
<td>eng</td>
</tr>
</table>
</body>
</html>
Output:
Practical #1 6
Objective: Create a HTML web page for a restaurant with three frames of Transmission
Media
Coding:
First page
<html>
<head><title>Frame-set</title></head>
<frameset rows="20%,80%">
<frame src="mainpage.html" name="main page" >
<frameset cols="50%,50%">
<frame src="guidedmedia.html" name="guided media" >
<frame src="unguidedmedia.html"name="unguided media" >
</frameset>
</frameset>
</html>
Main page
<html>
<head><title>transmission medium</title></head>
<body>
<h1>
Transmission Medium
</h1>
<ol>
<li>
<a href="Guided Media.html">Guided Media </a>
</li>
<li>
<a href="Unguided Media.html">UnGuided Media </a>
</li>
</ol>
</body>
</html>
Guided media
<html>
<head><title> transmission media </title></head>
<body>
<h1>
Guided Media
</h1>
<p>
Guided Media uses a cabling system that guides the data signal along a specefic path. Several
types of guided media are
Twisted pair cable, coaxial cable, and Fiber optic cable.

</p>
<h2>
Twisted Pair Cable
</h2>
<p>
Twisted pair cable is the most used data communication cable. It consists of pairs of copper wire
twisted
around one another as shown in fig.4-5. The purpose of twisting the cable is to reduce cross talk
and electromagnetic
interference and make the transmission more reliable. Telephone cable consists of 4 pairs of
twisted cables. Transmission
speed of twisted pair cable ranges from 2 million bits per second to 10 billion bits per second.
</p>
<img src= "twistedCable.jpg" alt= "twisted pair" width="200" height="200">
<h2>Coaxial Cable </h2>
<p> Coaxial cable is used for local area networks and cable television systems. It consists of
copper wire surrounded by an insulating layer. The insulating layer itself is surrounded by a
conductive layer as shown in Fi. 4-6. Insulation reduces interference and distortion.
Transmission speed ranges from 200 million bits per second to more than 500 million bits per
second. </p>
<img src= "coaxial-cable.webp" alt="Coaxial cable" width="200" height="200">
<h2> Fiber Optic Cable </h2>
<p>Fiber optic cable consists of smooth hair-thin strands of transparent material. In fiber optic
communication, the transmitter has a converter that converts electrical signal int light waves.
These light waves are transmitted over fiber optic cable. Another converter is placed at the
receiving end that converts the light waves back to electrical signals. </p>
<p>A single Fiber optic cable can carry up to 50,000 communication lines. It provides high
quality transmission at extremely fast speed. It can transmit trillions of bits per second. It is not
affected by electromagnetic fields and can transmit both analog and digital signals. </p>
<p>Fiber optic cable is more expensive than twisted pair cable and coaxial cables. It is used for
data transmission over long distances. Fiber optic cable is shown in Fig.4-7.
</p>
<img src="fiber-optic-.webp" alt="Fiber cable" width="200" height="200">
</body>
</html>
Unguided media
<html>

<body>
<h1>Unguided Media </h1>
<p>Unguided media signals travel through open space and nothing guides them along any
specific path. They do not use cables for data transmission. Unguided media can be classified
into radio waves, microwaves, infra-red and satellite communication. </p>
<h2>Radio Waves </h2>
<p> Radio waves are electromagnetic waves that are propagated by antennas. Radio transmission
consists of a transmitter and a receiver. A transmitter transmits a radio signal to the receiver
which receives it. Radio waves are used to transmit music, conversation, pictures, and data. Data
can be transmitted over long distance using radio waves. These waves are invisible and
undetectable to human beings. </p>
<p> The following are some applications of radio waves. </p>
<ul>
<li>Radio and television broadcast. </li>
<img src="download.jpg" alt="television broadcast" width="250"height"250">
<li>Cell phone communication. </li>
<img src="Mobile-Communication.webp" alt="cell phone communication" width="300"

height="150">
<li>Radi controlled toys. </li>
<img src="radio car.jpg" alt="Radio controlled car" width="250" height="250">

<li>Satellite communication </li>
<li>Wireless networks and wireless internet. </li>
</ul>
<h2>Microwaves </h2>
<p>Microwave signals travel through open space like radio waves. Microwaves provide much
faster transmission rates than telephone lines or coaxial cables. Microwave antennas are installed
on tall buildings or high towers as shown in Fig.4-11. The transmitting and the receiving sites
must be within sight of one another. Microwaves are used for satellite communication and other
long distance wireless communications. </p>
<img src="Microwave_link.jpg" alt="Microwave Transmission" width="300" height="200">
<h2>Infra-red </h2>
<p> Infra-red waves are light energy that we cannot see. It travels through space at the speed of
light. It is used for short distance communication. Infra-red waves are usually used in remote
controls for television. DVD players and other similar devices. Infra-red wireless signals are
disrupted by persons or objects in between television and remote control is shown in Fig.4-12.
</p>
<img src="ist.png" alt="Infra-red communication" width="300" height="250">
<h2> Bluetooth </h2>
<p> Bluetooth is a wireless communication technology that uses radio waves to connect portable
electronic devices over short distances. It eliminates the need for cable connection and provides
fast and reliable transmission. It supports networking of a wide range of portable devices that
work on low battery life. These devices include mobile phone, mouse, keyboard, wireless
speaker, wireless headset, tablet, laptop computer and personal computer. Laptop computers
have built-in Bluetooth, but personal computers can use Bluetooth adapters to communicate with
Bluetooth devices. The most common use of Bluetooth is connecting a mobile phone to a
wireless headset or to a laptop computer to transfer voice data. Bluetooth technology can
transmit text, image, voice, and video.
</p>
</body>
</html>
Output:
Practical # 17
Object: Create an HTML web page for a restaurant with three frames. The first frame will be
horizontal on displaying the name and address of the restaurant. The second frame, which is
horizontal, will list the available food items. The third frame is also horizontal and will display
the introduction to the restaurant.
FRAME1 TEXT:
Caspian Restaurant Jinnah Market, F-6, Islamabad.
FRAME2 TEXT:
Menu
Soup
Chicken Corn Soup
Hot and Sour Soup
Sandwiches
Spicy Crispy Chicken Sandwich
Spicy Chicken Pocket
Sandwich Club Sandwich
Chicken Sandwich
Burgers
Chicken Burger
Chicken Ginger Burger
Fried Chicken Breast Burger
Fish Fillet Burger
Chicken
Fried Chicken
Chicken Drumsticks
Chicken Shashlik
Chicken Nuggets
Stir Fried Chicken
FRAME3 TEXT: in Screenshot
Coding:
Page 1= “Main file”:
<html>
<head>
<title>Frameset</title>
</head>
<frameset>
<frameset rows=" 15%,60%,25%">
<frame src="frame1.html" name="Frame Text 1">
</frameset>
</html>
Page 2=” Frame 1”:

<html>
<head>
<title>Frame Text 1</title>
</head>
<body>
<center><h1><font type="Cambria">Caspian Restaurant</font></h1>
<h2>Jinnah Market, F-6, Islamabad. <h2>
</body>
</html>
Page 3= “Frame 2”:
<html>
<head>
</head>
<body bgcolor="#DDA0DD">
<center><h2>Menu</h2></center>
<ul>
<li><b>Soup</b></li>
<ul>
<li>Chicken Corn Soup</li>
<li>Hot and Sour Soup</li>
</ul>
<li><b>Sandwiches</b></li>
<ul>
<li>Spicy Crispy Chicken Sandwich</li>
<li>Spicy Chicken Pocket</li>
<li>Sandwich Club Sandwich</li>
<li>Chicken Sandwich</li>
</ul>
<li><b>Burgers</b></li>
<ul>
<li>Chicken Burger</li>
<li>Chicken Ginger Burger</li>
<li>Fried Chicken Breast Burger</li>
<li>Fish Fillet Burger</li>
</ul>
<li><b>Chicken</b></li>
<ul>
<li>Fried Chicken</li>
<li>Chicken Drumsticks</li>
<li>Chicken Shashlik</li>
<li>Chicken Nuggets</li>
<li>Stir Fried Chicken</li>
</ul>
</ul>
</body>
</html>
Page 4= “Frame 3”:
<html>
<head>
</head>
<body bgcolor="#AFEEEE">
<p>
The Caspian Restaurant is Pakistan's most recognized and distinguished hospitality brand with a
history of market innovation and excellence in restaurants. The Caspian Restaurant is regarded
and respected as the number one restaurant entity in Pakistan by local and foreign observers.
</p>
<p>
The Caspian Restaurant is an example of gracious dining, outstanding service, extraordinary
classic and contemporary cuisine. The restaurant has become the ultimate dinning destinations in
Pakistan. From family occasions to business dinners and moments of the heart, this place is
where unforgettable memories are made. </p>
<p>
The Caspian Restaurant was established in 2001 by hotelier/restaurant entrepreneur, considered
by many as the pioneer hotelier and restaurant in Pakistan.
</p>
</body>
</html>
Output:

Fatema Abbas Portfolio

Uploaded by

Copyright:

Available Formats

You might also like

Fatema Abbas Portfolio

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Fatema Abbas Portfolio

Uploaded by

Copyright:

Available Formats

Practical # 1

<br><b>Artificial Intelligence (AI):</b> Developing algorithms and systems that exhibit

machine learning, natural language processing, and computer vision.

1. Create a bold heading of Types of Networks

2. Display the types of Networks in definition list format

<title> Definition List </title>

<dt> <b> Local Area Network </b> </dt>

<dt> <b> Wide Area Network </b> </dt>

Objective: Write HTML code in Notepad to create a web page.

<title> Network Topologies </title>

<h1> <font color = "blue"> TYPES OF NETWORK TOPOLOGIES </font> </h1>

<h3> <font color = "blue"> Advantages of Bus Topology </font> </h3>

<li> Easy to setup as compared to Star or Mesh Topology. </li>

<li> Suitable for small networks. </li>

<h3> <font color = "blue"> Limitations of Bus topology </font> </h3>

<li> Difficult to detect and fix faults </li>

<h3> <font color = "pink"> Ring Topology </font> </h3>

<h3> <font color = "blue"> Advantages of Ring Topology </font> </h3>

<li> High network performance. </li>

<li> Server or switch is not required to manage the network. </li>

<h3> <font color = "blue"> Limitations of Ring Topology </font> </h3>

<li> Detection of fault is difficult. </li>

<li> Expansive than Star and Bus topologies. </li>

<h3> <font color = "pink"> Star Topology </font> </h3>

<h3> <font color = "blue"> Advantages of Star Topology </font> </h3>

<li> Provides fast communication between computers. </li>

<li> Easy to connect new devices to the network. </li>

<li> Easy to detect and fix faults. </li>

<h3> <font color = "blue"> Limitations of Star Topology </font> </h3>

<li> Costly to implement </li>

<h3> <font color = "pink"> Mesh Topology </font> </h3>

<h3> <font color = "blue"> Advantages of Mesh Topology </font> </h3>

<li> It is the most reliable network topology </li>

<h3> <font color = "blue"> Limitations of Mesh Topology </font> </h3>

<li> Difficult to add new computer. </li>

<body background = "img.jpg" >

<h2><font color = "magenta"size="6"><b>Miss zainab</b></font></h2>

List of Useful Website

Html 1st page coding:

HTML 2nd page coding:

<h2>Radio Waves </h2>

<table style=” width:100%”>

<th> S.No. </th>

<head><title> transmission media </title></head>

Twisted pair cable, coaxial cable, and Fiber optic cable.

Twisted Pair Cable

<img src= "twistedCable.jpg" alt= "twisted pair" width="200" height="200">

<h2>Coaxial Cable </h2>

<img src= "coaxial-cable.webp" alt="Coaxial cable" width="200" height="200">

<h2> Fiber Optic Cable </h2>

<img src="fiber-optic-.webp" alt="Fiber cable" width="200" height="200">

<head><title> Transmission Media 3 </title></head>

<h2>Radio Waves </h2>

<p> The following are some applications of radio waves. </p>

<li>Radio and television broadcast. </li>

<img src="download.jpg" alt="television broadcast" width="250"height"250">

<li>Cell phone communication. </li>

<img src="Mobile-Communication.webp" alt="cell phone communication" width="300"

<li>Radi controlled toys. </li>