e39465ad2f
new file: Files/flashplayer_32_sa.exe
new file: favicon.ico
new file: globe.gif
new file: imgs/download.png
new file: imgs/zuck.jpg
new file: index.html
new file: other.ico
new file: script.js
new file: site.webmanifest
new file: sitemap.html
new file: styles/backround.css
new file: styles/border.css
new file: styles/fonts/Titillium_Web/OFL.txt
new file: styles/fonts/Titillium_Web/TitilliumWeb-Black.ttf
new file: styles/fonts/Titillium_Web/TitilliumWeb-Bold.ttf
new file: styles/fonts/Titillium_Web/TitilliumWeb-BoldItalic.ttf
new file: styles/fonts/Titillium_Web/TitilliumWeb-ExtraLight.ttf
new file: styles/fonts/Titillium_Web/TitilliumWeb-ExtraLightItalic.ttf
new file: styles/fonts/Titillium_Web/TitilliumWeb-Italic.ttf
new file: styles/fonts/Titillium_Web/TitilliumWeb-Light.ttf
new file: styles/fonts/Titillium_Web/TitilliumWeb-LightItalic.ttf
new file: styles/fonts/Titillium_Web/TitilliumWeb-Regular.ttf
new file: styles/fonts/Titillium_Web/TitilliumWeb-SemiBold.ttf
new file: styles/fonts/Titillium_Web/TitilliumWeb-SemiBoldItalic.ttf
new file: styles/fonts/webfontkit-20221027-163353/generator_config.txt
new file: styles/fonts/webfontkit-20221027-163353/specimen_files/grid_12-825-55-15.css
new file: styles/fonts/webfontkit-20221027-163353/specimen_files/specimen_stylesheet.css
new file: styles/fonts/webfontkit-20221027-163353/stylesheet.css
new file: styles/fonts/webfontkit-20221027-163353/titilliumweb-extralight-demo.html
new file: styles/fonts/webfontkit-20221027-163353/titilliumweb-extralight-webfont.woff
new file: styles/fonts/webfontkit-20221027-163353/titilliumweb-extralight-webfont.woff2
new file: styles/fonts/webfontkit-20221027-165950/generator_config.txt
new file: styles/fonts/webfontkit-20221027-165950/specimen_files/grid_12-825-55-15.css
new file: styles/fonts/webfontkit-20221027-165950/specimen_files/specimen_stylesheet.css
new file: styles/fonts/webfontkit-20221027-165950/stylesheet.css
new file: styles/fonts/webfontkit-20221027-165950/titilliumweb-bold-demo.html
new file: styles/fonts/webfontkit-20221027-165950/titilliumweb-bold-webfont.woff
new file: styles/fonts/webfontkit-20221027-165950/titilliumweb-bold-webfont.woff2
new file: styles/style.css
new file: tools/2048/.gitignore
new file: tools/2048/.jshintrc
new file: tools/2048/CONTRIBUTING.md
new file: tools/2048/LICENSE.txt
new file: tools/2048/README.md
new file: tools/2048/Rakefile
new file: tools/2048/favicon.ico
new file: tools/2048/index.html
new file: tools/2048/js/animframe_polyfill.js
new file: tools/2048/js/application.js
new file: tools/2048/js/bind_polyfill.js
new file: tools/2048/js/classlist_polyfill.js
new file: tools/2048/js/game_manager.js
new file: tools/2048/js/grid.js
new file: tools/2048/js/html_actuator.js
new file: tools/2048/js/keyboard_input_manager.js
new file: tools/2048/js/local_storage_manager.js
new file: tools/2048/js/tile.js
new file: tools/2048/meta/apple-touch-icon.png
new file: tools/webretro/cores/neocd_libretro.js
new file: tools/webretro/cores/neocd_libretro.wasm
new file: tools/webretro/cores/nestopia_libretro.js
new file: tools/webretro/cores/nestopia_libretro.wasm
new file: tools/webretro/cores/o2em_libretro.js
new file: tools/webretro/cores/o2em_libretro.wasm
new file: tools/webretro/cores/opera_libretro.js
new file: tools/webretro/cores/opera_libretro.wasm
570 lines
12 KiB
HTML
570 lines
12 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en"><!-- #BeginTemplate "/Templates/Main.dwt" --><!-- DW6 -->
|
|
|
|
<!-- Mirrored from www.mathsisfun.com/sets/logic-gates.html by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 29 Oct 2022 01:00:48 GMT -->
|
|
<head>
|
|
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
|
|
|
|
|
|
|
|
|
|
<!-- #BeginEditable "doctitle" -->
|
|
<title>Logic Gates</title>
|
|
<meta name="description" content="Math explained in easy language, plus puzzles, games, quizzes, videos and worksheets. For K-12 kids, teachers and parents.">
|
|
|
|
|
|
|
|
<style>
|
|
|
|
.boxa {
|
|
text-align: center;
|
|
display: inline-block;
|
|
vertical-align:bottom;
|
|
margin: 0 25px 35px 0;
|
|
|
|
}
|
|
|
|
</style>
|
|
|
|
|
|
<!-- #EndEditable -->
|
|
<meta name="keywords" content="math, maths, mathematics, school, homework, education">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes">
|
|
<meta name="HandheldFriendly" content="true">
|
|
<meta name="referrer" content="always">
|
|
<link rel="preload" href="../images/style/font-champ-bold.ttf" as="font" type="font/ttf" crossorigin="">
|
|
<link rel="preload" href="../style4.css" as="style">
|
|
<link rel="preload" href="../main4.js" as="script">
|
|
<link rel="stylesheet" href="../style4.css">
|
|
<script src="../main4.js" defer="defer"></script>
|
|
<!-- Global site tag (gtag.js) - Google Analytics -->
|
|
<script async="" src="https://www.googletagmanager.com/gtag/js?id=UA-29771508-1"></script>
|
|
<script>
|
|
window.dataLayer = window.dataLayer || [];
|
|
function gtag(){dataLayer.push(arguments);}
|
|
gtag('js', new Date());
|
|
gtag('config', 'UA-29771508-1');
|
|
</script>
|
|
</head>
|
|
|
|
<body id="bodybg">
|
|
|
|
<div id="stt"></div>
|
|
<div id="adTop"></div>
|
|
<header>
|
|
<div id="hdr"></div>
|
|
<div id="tran"></div>
|
|
<div id="adHide"></div>
|
|
<div id="cookOK"></div>
|
|
</header>
|
|
|
|
<div class="mid">
|
|
|
|
<nav>
|
|
<div id="menuWide" class="menu"></div>
|
|
<div id="logo"><a href="../index.html"><img src="../images/style/logo.svg" alt="Math is Fun"></a></div>
|
|
|
|
<div id="search" role="search"></div>
|
|
<div id="linkto"></div>
|
|
|
|
<div id="menuSlim" class="menu"></div>
|
|
<div id="menuTiny" class="menu"></div>
|
|
</nav>
|
|
|
|
<div id="extra"></div>
|
|
|
|
<article id="content" role="main">
|
|
|
|
<!-- #BeginEditable "Body" -->
|
|
|
|
|
|
<h1 class="center">Logic Gates</h1>
|
|
|
|
<p class="center">Logic Gates process <b>true</b> and <b>false</b> values.</p>
|
|
<h2>And
|
|
|
|
</h2>
|
|
<p>The "and" logic gate must have <b>both </b>inputs true to become true.</p>
|
|
<p>Try clicking on the left hand lines here (green is true and blue is false):</p>
|
|
<div class="script" style="height: 120px;">
|
|
images/gate.js?t=and&tchg=0&n=0&nchg=0
|
|
</div>
|
|
<p>We can show that in a "truth table" (T is for true and F for false):</p>
|
|
<div class="simple">
|
|
|
|
<table class="center">
|
|
<tbody>
|
|
<tr>
|
|
<th style="width: 50px;">A</th>
|
|
<th style="width: 50px;">B</th>
|
|
<td style="width: 20px;"><br>
|
|
</td>
|
|
<th style="width: 90px;">A and B</th></tr>
|
|
<tr>
|
|
<td>F</td>
|
|
<td>F</td>
|
|
<td><br>
|
|
</td>
|
|
<td>F</td></tr>
|
|
<tr>
|
|
<td>F</td>
|
|
<td>T</td>
|
|
<td><br>
|
|
</td>
|
|
<td>F</td></tr>
|
|
<tr>
|
|
<td>T</td>
|
|
<td>F</td>
|
|
<td><br>
|
|
</td>
|
|
<td>F</td></tr>
|
|
<tr>
|
|
<td>T</td>
|
|
<td>T</td>
|
|
<td><br>
|
|
</td>
|
|
<td class="bga1">T</td></tr>
|
|
</tbody></table> </div>
|
|
|
|
<div class="example">
|
|
|
|
<h3>Example: If we cut the grass <b>and</b> wash the car we get ice cream!</h3>
|
|
<div class="simple">
|
|
|
|
<table class="center">
|
|
<tbody>
|
|
<tr>
|
|
<th>cut grass</th>
|
|
<th>wash car</th>
|
|
<td style="width: 20px;"><br>
|
|
</td>
|
|
<th>ice cream</th></tr>
|
|
<tr>
|
|
<td>F</td>
|
|
<td>F</td>
|
|
<td><br>
|
|
</td>
|
|
<td>F</td></tr>
|
|
<tr>
|
|
<td>F</td>
|
|
<td>T</td>
|
|
<td><br>
|
|
</td>
|
|
<td>F</td></tr>
|
|
<tr>
|
|
<td>T</td>
|
|
<td>F</td>
|
|
<td><br>
|
|
</td>
|
|
<td>F</td></tr>
|
|
<tr>
|
|
<td>T</td>
|
|
<td>T</td>
|
|
<td><br>
|
|
</td>
|
|
<td class="bga1">T</td></tr>
|
|
</tbody></table> </div><p>Only if we do both jobs do we get ice cream</p> </div>
|
|
|
|
|
|
<h2>Or</h2>
|
|
|
|
<p>The "or" logic gate can have <b>either </b>(or both) inputs true to become true:</p>
|
|
|
|
<div class="script" style="height: 120px;">
|
|
images/gate.js?t=or&tchg=0&n=0&nchg=0
|
|
</div>
|
|
<p>In a truth table:</p>
|
|
<div class="simple">
|
|
|
|
<table class="center">
|
|
<tbody>
|
|
<tr>
|
|
<th style="width: 50px;">A</th>
|
|
<th style="width: 50px;">B</th>
|
|
<td style="width: 20px;"><br>
|
|
</td>
|
|
<th style="width: 90px;">A or B</th></tr>
|
|
<tr>
|
|
<td>F</td>
|
|
<td>F</td>
|
|
<td><br>
|
|
</td>
|
|
<td>F</td></tr>
|
|
<tr>
|
|
<td>F</td>
|
|
<td>T</td>
|
|
<td><br>
|
|
</td>
|
|
<td class="bga1">T</td></tr>
|
|
<tr>
|
|
<td>T</td>
|
|
<td>F</td>
|
|
<td><br>
|
|
</td>
|
|
<td class="bga1">T</td></tr>
|
|
<tr>
|
|
<td>T</td>
|
|
<td>T</td>
|
|
<td><br>
|
|
</td>
|
|
<td class="bga1">T</td></tr>
|
|
</tbody></table> </div>
|
|
|
|
<div class="example">
|
|
|
|
<h3>Example: If we cut the grass <b>or</b> wash the car we get ice cream!</h3>
|
|
<div class="simple">
|
|
|
|
<table class="center">
|
|
<tbody>
|
|
<tr>
|
|
<th>cut grass</th>
|
|
<th>wash car</th>
|
|
<td style="width: 20px;"><br>
|
|
</td>
|
|
<th>ice cream</th></tr>
|
|
<tr>
|
|
<td>F</td>
|
|
<td>F</td>
|
|
<td><br>
|
|
</td>
|
|
<td>F</td></tr>
|
|
<tr>
|
|
<td>F</td>
|
|
<td>T</td>
|
|
<td><br>
|
|
</td>
|
|
<td class="bga1">T</td></tr>
|
|
<tr>
|
|
<td>T</td>
|
|
<td>F</td>
|
|
<td><br>
|
|
</td>
|
|
<td class="bga1">T</td></tr>
|
|
<tr>
|
|
<td>T</td>
|
|
<td>T</td>
|
|
<td><br>
|
|
</td>
|
|
<td class="bga1">T</td></tr>
|
|
</tbody></table> </div><p>In this case we can do either job (or both) to get ice cream. Let's wash the car.</p> </div>
|
|
|
|
|
|
<h2>Xor (eXclusive Or)</h2>
|
|
<p><b>Xor</b> is like <b>or</b> except it becomes false when <b>both </b>inputs are true:</p>
|
|
<div class="script" style="height: 120px;">
|
|
images/gate.js?t=xor&tchg=0&n=0&nchg=0
|
|
</div>
|
|
<p>
|
|
Here we see <b>or</b> and <b>xor </b>side-by-side:
|
|
</p>
|
|
<div class="simple">
|
|
<table class="center">
|
|
<tbody>
|
|
<tr><th style="width: 50px;">A</th>
|
|
<th style="width: 50px;">B</th>
|
|
<td style="width: 20px;"><br>
|
|
</td><th style="width: 90px;">A or B</th>
|
|
<th style="width: 90px;">A xor B</th>
|
|
</tr>
|
|
<tr>
|
|
<td>F</td>
|
|
<td>F</td>
|
|
<td><br></td>
|
|
<td>F</td>
|
|
<td>F</td></tr>
|
|
<tr>
|
|
<td>F</td>
|
|
<td>T</td>
|
|
<td><br></td>
|
|
<td class="bga1">T</td>
|
|
<td class="bga1">T</td></tr>
|
|
<tr>
|
|
<td>T</td>
|
|
<td>F</td>
|
|
<td><br></td>
|
|
<td class="bga1">T</td>
|
|
<td class="bga1">T</td></tr>
|
|
<tr>
|
|
<td>T</td>
|
|
<td>T</td>
|
|
<td><br></td>
|
|
<td class="bga1">T</td>
|
|
<td>F</td></tr>
|
|
</tbody></table> </div>
|
|
<p><b>Xor </b>is like both your best friends fight. Life is fun with either one, but not both.</p>
|
|
<p>Think: "eXclusively yours" (no one else allowed).</p>
|
|
<h2>Not</h2>
|
|
<p>We can also "not" or "invert":</p>
|
|
<div class="script" style="height: 120px;">
|
|
images/gate.js?t=not&tchg=0&n=1&nchg=1
|
|
</div>
|
|
<ul>
|
|
<li>not true is false</li>
|
|
<li>not false is true</li></ul>
|
|
<p>As a "truth table":
|
|
</p>
|
|
<div class="simple">
|
|
<table style="width: 200px" class="center">
|
|
<tbody>
|
|
<tr>
|
|
<th>A<br>
|
|
</th><td><br></td><th>not A</th></tr>
|
|
<tr>
|
|
<td>F</td>
|
|
<td><br></td>
|
|
<td>T</td></tr>
|
|
<tr>
|
|
<td>T</td>
|
|
<td><br></td>
|
|
<td>F</td></tr>
|
|
</tbody></table> </div>
|
|
<p>Important: it is the <b>circle</b> at the end that makes it "not":</p>
|
|
<p class="center"><img src="images/gate-not-descr.svg" alt="not gate" longdesc="not%20gate.html"></p>
|
|
<p>So we can "not" the other logic gates like this:</p><br>
|
|
<h2>Nand
|
|
</h2>
|
|
<p>Nand is "and" with a "not", so it is true except when both inputs are true:</p>
|
|
<div class="script" style="height: 120px;">
|
|
images/gate.js?t=and&tchg=0&n=1&nchg=0 </div>
|
|
<p>We can show that in a "truth table" (T is for true and F for false):</p>
|
|
<div class="simple">
|
|
<table class="center">
|
|
<tbody>
|
|
<tr>
|
|
<th style="width: 50px;">A</th>
|
|
<th style="width: 50px;">B</th>
|
|
<td style="width: 20px;"><br>
|
|
</td><td><i>A and B</i></td><th style="width: 90px;">A nand B</th></tr>
|
|
<tr>
|
|
<td>F</td>
|
|
<td>F</td>
|
|
<td><br></td>
|
|
<td><i>F</i></td>
|
|
<td class="bga1">T</td></tr>
|
|
<tr>
|
|
<td>F</td>
|
|
<td>T</td>
|
|
<td><br></td>
|
|
<td><i>F</i></td>
|
|
<td class="bga1">T</td></tr>
|
|
<tr>
|
|
<td>T</td>
|
|
<td>F</td>
|
|
<td><br></td>
|
|
<td><i>F</i></td>
|
|
<td class="bga1">T</td></tr>
|
|
<tr>
|
|
<td>T</td>
|
|
<td>T</td>
|
|
<td><br></td>
|
|
<td><i>T</i></td>
|
|
<td>F</td></tr>
|
|
</tbody></table> </div>
|
|
|
|
|
|
<h2>Nor</h2>
|
|
<p>Nor is "or" and "not", so is false when <b>either (or both)</b> inputs are true:</p>
|
|
<div class="script" style="height: 120px;">
|
|
images/gate.js?t=or&tchg=0&n=1&nchg=0 </div>
|
|
<p>In a truth table:</p>
|
|
<div class="simple">
|
|
<table class="center">
|
|
<tbody>
|
|
<tr>
|
|
<th style="width: 50px;">A</th>
|
|
<th style="width: 50px;">B</th>
|
|
<td style="width: 20px;"><br>
|
|
</td><td><i>A or B</i></td><th style="width: 90px;">A nor B</th></tr>
|
|
<tr>
|
|
<td>F</td>
|
|
<td>F</td>
|
|
<td><br></td>
|
|
<td><i>F</i></td>
|
|
<td class="bga1">T</td></tr>
|
|
<tr>
|
|
<td>F</td>
|
|
<td>T</td>
|
|
<td><br></td>
|
|
<td><i>T</i></td>
|
|
<td>F</td></tr>
|
|
<tr>
|
|
<td>T</td>
|
|
<td>F</td>
|
|
<td><br></td>
|
|
<td><i>T</i></td>
|
|
<td>F</td></tr>
|
|
<tr>
|
|
<td>T</td>
|
|
<td>T</td>
|
|
<td><br></td>
|
|
<td><i>T</i></td>
|
|
<td>F</td></tr>
|
|
</tbody></table> </div>
|
|
|
|
|
|
<h2>Xnor</h2>
|
|
<p><b>Xnor</b> is <b>xor</b> with a not:</p>
|
|
<div class="script" style="height: 120px;">
|
|
images/gate.js?t=xor&tchg=0&n=1&nchg=0 </div>
|
|
<p>As a truth table:
|
|
</p>
|
|
<div class="simple">
|
|
<table class="center">
|
|
<tbody>
|
|
<tr><th style="width: 50px;">A</th>
|
|
<th style="width: 50px;">B</th>
|
|
<td style="width: 20px;"><br>
|
|
</td><th style="width: 90px;">A xnor B</th>
|
|
|
|
</tr>
|
|
<tr>
|
|
<td>F</td>
|
|
<td>F</td>
|
|
<td><br></td>
|
|
<td class="bga1">T</td>
|
|
</tr>
|
|
<tr>
|
|
<td>F</td>
|
|
<td>T</td>
|
|
<td><br></td>
|
|
<td>F</td>
|
|
</tr>
|
|
<tr>
|
|
<td>T</td>
|
|
<td>F</td>
|
|
<td><br></td>
|
|
<td>F</td>
|
|
</tr>
|
|
<tr>
|
|
<td>T</td>
|
|
<td>T</td>
|
|
<td><br></td>
|
|
<td class="bga1">T</td>
|
|
</tr>
|
|
</tbody></table> </div>
|
|
<p><b>Xnor </b>is true when both inputs <b>match </b>(both true or both false).<br>
|
|
</p><h2>All Together Now</h2>
|
|
|
|
<p>Here they are together:</p>
|
|
<div class="simple">
|
|
|
|
<table class="center">
|
|
<tbody>
|
|
<tr>
|
|
<td rowspan="1" colspan="2" class="larger">input<br>
|
|
</td>
|
|
|
|
<td><br>
|
|
</td>
|
|
<td rowspan="1" colspan="8"><span class="larger">output</span><span class="larger"></span></td>
|
|
|
|
|
|
|
|
</tr>
|
|
<tr><th style="width: 50px;">A</th>
|
|
<th style="width: 50px;">B</th>
|
|
<td style="width: 20px;"><br>
|
|
</td>
|
|
<th style="width: 70px;">and</th>
|
|
<th style="width: 70px;">nand</th>
|
|
<td><br></td><th style="width: 70px;">or</th>
|
|
<th style="width: 70px;">nor</th>
|
|
<td><br></td><th style="width: 70px;">xor</th>
|
|
<th style="width: 70px;">xnor</th>
|
|
</tr>
|
|
<tr>
|
|
<td>F</td>
|
|
<td>F</td>
|
|
<td><br>
|
|
</td>
|
|
<td>F</td>
|
|
<td class="bga1">T</td>
|
|
<td><br></td>
|
|
<td>F</td>
|
|
<td class="bga1">T</td>
|
|
<td><br></td>
|
|
<td>F</td>
|
|
<td class="bga1">T</td>
|
|
</tr>
|
|
<tr>
|
|
<td>F</td>
|
|
<td>T</td>
|
|
<td><br>
|
|
</td>
|
|
<td>F</td>
|
|
<td class="bga1">T</td>
|
|
<td><br></td>
|
|
<td class="bga1">T</td>
|
|
<td>F</td>
|
|
<td><br></td>
|
|
<td class="bga1">T</td>
|
|
<td>F</td>
|
|
</tr>
|
|
<tr>
|
|
<td>T</td>
|
|
<td>F</td>
|
|
<td><br>
|
|
</td>
|
|
<td>F</td>
|
|
<td class="bga1">T</td>
|
|
<td><br></td>
|
|
<td class="bga1">T</td>
|
|
<td>F</td>
|
|
<td><br></td>
|
|
<td class="bga1">T</td>
|
|
<td>F</td>
|
|
</tr>
|
|
<tr>
|
|
<td>T</td>
|
|
<td>T</td>
|
|
<td><br>
|
|
</td>
|
|
<td class="bga1">T</td>
|
|
<td>F</td>
|
|
<td><br></td>
|
|
<td class="bga1">T</td>
|
|
<td>F</td>
|
|
<td><br></td>
|
|
<td>F</td>
|
|
<td class="bga1">T</td>
|
|
</tr>
|
|
</tbody></table> </div>
|
|
|
|
<p>
|
|
See them in action here (try clicking on the name, or the output line):
|
|
</p>
|
|
|
|
<div class="script" style="height: 120px;">
|
|
images/gate.js?t=and&tchg=1&n=0&nchg=1</div>
|
|
|
|
<h2>In the Real World</h2>
|
|
<p>This classic chip has 4 nand gates on it:</p>
|
|
<p class="center">
|
|
<img src="images/7400.jpg">
|
|
</p><p>It's circuit diagram looks like this:</p>
|
|
<p class="center">
|
|
<img src="images/7400.png" class="center"></p><p>Example: you can connect pins 1 and 2 to different inputs, and will get an output from pin 3 except when both pins 1 and 2 are on.</p>
|
|
<p>(Note: power supply of 5 volts between "Vcc" and "GND")</p>
|
|
<p>There are many variations of these chips with different logic gates inside them. They operate really fast (millions of times a second), use very little power and cost very little. You can combine them to do amazing things.</p>
|
|
<p><br></p><br>
|
|
|
|
|
|
|
|
|
|
<div class="related">
|
|
<a href="boolean-algebra.html">Boolean Algebra</a>
|
|
<a href="../data/index.html">Sets Index</a>
|
|
</div>
|
|
<!-- #EndEditable -->
|
|
|
|
</article>
|
|
|
|
<div id="adend" class="centerfull noprint"></div>
|
|
<footer id="footer" class="centerfull noprint"></footer>
|
|
<div id="copyrt">Copyright © 2021 MathsIsFun.com</div>
|
|
|
|
</div>
|
|
</body><!-- #EndTemplate -->
|
|
<!-- Mirrored from www.mathsisfun.com/sets/logic-gates.html by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 29 Oct 2022 01:00:48 GMT -->
|
|
</html> |