are computer, printers and laptop. The information displayed of product should be
configuration/ technical details, price etc.
(Purpose: - Study image tag. Display image in tabular form along with the other text information.)
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
body {
background-color:#e8e8e8;
color:#000000;
}
div.gallery {
margin: 5px;
border: 1px solid #ccc;
float: left;
width: 180px;
}
div.gallery img {
width: 100%;
height: auto;
}
div.desc {
padding: 15px;
text-align: center;
}
</style>
</head>
<body>
<header><h1 align="center"><font color="green">COMPUTER PERIPHERALS</font></h1></header>
<div class="gallery">
<a target="_parent" href="MONITOR.jpg">
<img src="MONITOR.jpg" alt="MNTR" width="300" height="200">
</a>
<div class="desc">Monitors, commonly called as Visual Display Unit (VDU), are the main output device of a computer.
It forms images from tiny dots, called pixels that are arranged in a rectangular form. The sharpness
of the image depends upon the number of pixels.
</div>
</div>
<div class="gallery">
<a target="_parent" href="KEYBOARD.jpg">
<img src="KEYBOARD.jpg" alt="KBD" width="300" height="200">
</a>
<div class="desc">Keyboard is the most common and very popular input device which helps to input data to the computer.
The layout of the keyboard is like that of traditional typewriter, although there are some additional
keys provided for performing additional functions.
</div>
</div>
<div class="gallery">
<a target="_parent" href="MOUSE.jpg">
<img src="MOUSE.jpg" alt="MSE" width="600" height="400">
</a>
<div class="desc">Mouse is the most popular pointing device. It is a very famous cursor-control device having a small
palm size box with a round ball at its base, which senses the movement of the mouse and sends
corresponding signals to the CPU when the mouse buttons are pressed.
</div>
</div>
<div class="gallery">
<a target="_parent" href="JOYSTICK.jpg">
<img src="JOYSTICK.jpg" alt="JST" width="300" height="200">
</a>
<div class="desc">Joystick is also a pointing device, which is used to move the cursor position on a monitor screen.
It is a stick having a spherical ball at its both lower and upper ends. The lower spherical ball
moves in a socket. The joystick can be moved in all four directions.
</div>
</div>
<div class="gallery">
<a target="_parent" href="LASER_PRINTER.jpg">
<img src="LASER_PRINTER.jpg" alt="LSRPNTR" width="300" height="200">
</a>
<div class="desc">These are non-impact page printers. They use laser lights to produce the dots needed to form the
characters to be printed on a page.
</div>
</div>
<div class="gallery">
<a target="_parent" href="GRAPHIC_TABLET.jpg">
<img src="GRAPHIC_TABLET.jpg" alt="GPHTBLT" width="300" height="200">
</a>
<div class="desc">Digitizer is an input device which converts analog information into digital form. Digitizer can
convert a signal from the television or camera into a series of numbers that could be stored in
a computer. They can be used by the computer to create a picture of whatever the camera had been
pointed at.
</div>
</div>
</body>
</html>
Output Screenshot
No comments:
Post a Comment