-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
145 lines (121 loc) · 5.79 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
<!DOCTYPE html>
<html lang="en">
<head>
<title>Computer Hardware</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<style>
body {
background-color: honeydew ;
font-family: cursive, serif;
}
h3{
margin-left: 80px;
color: darkcyan;
}
p{
margin-left: 80px; font-size: 20px;
}
p, ol{
color: black;
margin-left: 80px; font-size: 20px;
}
h2 {
color: darkcyan;
margin-left: 10px;
}
ul, a{
color: darkcyan;
}
.carousel-inner > .item > img,
.carousel-inner > .item > a > img {
margin: auto; width: 40%;
}
.footer {
position: fixed;
left: 10px;
bottom: 0px;
right: 10px;
width: 95%;
background-color: honeydew;
color: black;
text-align: center;
}
</style>
</head>
<body>
<div class="container">
<h2><b>Computer Hardware</b></h2>
<ul class="nav nav-tabs">
<li class="active"><a href="#">Introduction</a></li>
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">Components <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="comp/cpu.html">CPU</a></li>
<li><a href="comp/memory.html">Memory</a></li>
<li><a href="comp/motherboard.html">Motherboard</a></li>
<li><a href="comp/ddrives.html">Disk drives</a></li>
</ul>
</li>
<li><a href="comp/ref.html">References</a></li>
</ul>
</div>
<div id="myCarousel" class="carousel slide" data-ride="carousel">
<!-- Indicators -->
<ol class="carousel-indicators">
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
<li data-target="#myCarousel" data-slide-to="2"></li>
</ol>
<!-- Wrapper for slides -->
<div class="carousel-inner" role="listbox">
<div class="item active">
<img src="https://www.tutorialandexample.com/wp-content/uploads/2019/09/Important-Computer-Hardware-Components-and-Parts.jpg" alt="img 1" height="400px" width="400px" >
</div>
<div class="item">
<img src="https://th.bing.com/th/id/R.b715d73cc0bba0680ade0bd57487c194?rik=eTQd91GavNbJ7A&riu=http%3a%2f%2fwww.pitara.com%2fwordpress%2fwp-content%2fuploads%2f2003%2f05%2fcomputer-hardware.jpg&ehk=Ljvgl6FvJDHhWavixkLQ7YZ%2fqyds40stMgHLMu3f0tY%3d&risl=&pid=ImgRaw&r=0" height="400px" width="400px">
</div>
<div class="item">
<img src="https://image.freepik.com/free-photo/maintenance-computer-cpu-hardware-upgrade-motherboard-component_94046-1305.jpg" height="400px" width="400px" >
</div>
</div>
<!-- Left and right controls -->
<a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">
<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div><!-- corousel end -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<h3> <b> Introduction </b></h3>
<p> The history of computer begins with the birth of abacus which is believed to be the first computer. It is said that Chinese invented Abacus around 4,000 years ago. It was a wooden rack which has metal rods with beads mounted on them. The beads were moved by the abacus operator according to some rules to perform arithmetic calculations. Abacus is still used in some countries like China, Russia and Japan.
</p>
<p>A computer is a programmable electronic device that accepts raw data as input and processes it with a set of instructions (a program) to produce the result as output. It renders output just after performing mathematical and logical operations and can save the output for future use. It can process numerical as well as non-numerical calculations. The term "computer" is derived from the Latin word "computare" which means to calculate.</p>
<p>There are many components involved in building a computer. Some of the main components are:
<ol>
<li>Input Devices</li>
<li>CPU</li>
<li>Motherboard</li>
<li>Output Devices</li>
<li>Memory</li>
</ol>
</p>
<p>
<b> Input devicies: </b> Devices that accept raw data, instructions and information into the computer. It is performed with the help of input devices.<br><br>
<b> CPU: </b> It converts the raw data into useful information. It takes the raw data from storage, processes it and then sends back the processed data to storage.<br><br>
<b> Motherboard: </b>
A motherboard is the main printed circuit board in general-purpose computers and other expandable systems. It holds and allows communication between many of the crucial electronic components of a system, such as the central processing unit and memory, and provides connectors for other peripherals.<br><br>
<b>Output Devices:</b> It presents the processed data through output devices like monitor, printer and speakers.<br><br>
<b>Memory:</b> The computer has primary memory and secondary storage to store data and instructions. It stores the data before sending it to CPU for processing and also stores the processed data before displaying it as output.
</p>
<br><br>
<div class="footer">
created by Chandana Udupa
</div>
</body>
</html>