API tools faq
paste
Advertisement
Guest User

HTML SNT

a guest
Dec 12th, 2019
259
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 8.02 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.     <link rel="stylesheet" href="styles.css"></link>
  5.     <link rel="icon" href="images/processeur.jpg">
  6.     <meta charset="utf-8">
  7.     <title>
  8.         1971: Premier processeur d'Intel
  9.     </title>
  10. </head>
  11. <body>
  12.     <a id="debut"/>
  13.     <br>
  14.     <br>
  15.     <nav>
  16.         <div id="navbar">
  17.             <ol>
  18.                 <li><a href="#1971">Définition</a></li>
  19.                 <li><a href="#date">Dates</a></li>
  20.                 <li><a href="#questions">Questions</a></li>
  21.                 <li><a href="#sources">Sources</a></li>
  22.             </ol>
  23.         </div>
  24.     </nav>
  25.     <figure>
  26.         <center>
  27.             <h1 class="title">
  28.                 Intel 4004
  29.             </h1>
  30.         </center>
  31.         <a id="1971"> </a>
  32.         <center>
  33.             <img src="images/Intel4004.jpg" class="top"></img>
  34.         </center>
  35.     </figure>
  36.     <img src="images/LogoJeanMonnet.png" alt="Le logo du lycée aurait dû s'afficher" title="Logo Jean Monnet" width="100">
  37.     <!-- <img class="logo" src="images/intel.png" alt="L'image d'Intel ne s'est pas affiché" title="Intel Logo" width="300"> -->
  38.     <br>
  39.     <h2> 1971: Premier processeur développé par Intel </h2>
  40.     <hr>
  41.  
  42.     <p class="test">
  43.     </p>
  44.         <div class="desc">
  45.             <p class="def"> Le premier processeur développé par Intel, sorti 3 ans après la création de l’entreprise, est le <strong>Intel 4004</strong>.<br>
  46.             Un projet commandité par la société japonaise «Busicom».<br>
  47.             Ce processeur a rapidement été dépassé, notamment par le «;Intel 8008;» et avait des caractéristiques éloignées de celles que l’on trouve aujourd’hui (c’est normal) qui ont par exemple une finesse de gravure 1000 fois plus fine.<br>
  48.             Il a donc été créer pour la société «Busicom», en 1969 pour lui permettre de faire un type de calculatrices.<br>
  49.             Fabriqué par 2 ingénieurs d’Intel, il marque un début pour les processeurs car beaucoup lui ont suivis (de nouvelles technologies et manière de fonctionner font qu’ils sont très différents aujourd’hui).<br>
  50.             Sa puissance d’exécution était de 92.600 opérations par seconde. Il était en céramique et a introduit avec lui de la mémoire vive.  </p>
  51.             <p></p>
  52.         </div>     
  53.         <a id="date"> </a>
  54.         <hr>
  55.         <h2 class="titlesize">Dates</h2>
  56.         <div class="surligne">
  57.             <div class="size1"><strong>1969:</strong> Mise au point de l’architecture du composant électronique Intel 4004</div>
  58.             <strong></strong><div class="size2"><strong>Mars 1971:</strong> Première production pour l’industriel qui a commandité son développement</div>
  59.             <strong></strong><div class="size3"><strong>15 Novembre 1971:</strong> Intel annonce sa commercialisation</div>
  60.             <strong></strong><div class="size4"><strong>1981:</strong> Fin de la production</div>
  61.         </div>
  62.         <a id="questions"> </a>
  63.         <br>
  64.         <hr>
  65.         <div id="quest">
  66.         <div class="c1"
  67.          onclick="pchild=this.getElementsByTagName('p'); if(pchild[0].style.visibility!='hidden'){pchild[0].style.visibility='hidden'; pchild[0].style.height='0';}else{pchild[0].style.visibility=''; pchild[0].style.height=''}"><h2>Quoi ?</h2>
  68.         <p style="">Un processeur crée par la société Intel. Il est le premier à utiliser la mémoire vive et permet de réaliser 92.600 opérations par seconde.<br>
  69.             <br>
  70.             <img src="images/questions/intel4004.jpg" title="Intel 4004" alt="Un Intel 4004 aurait du s'afficher ici" width="215" class="sizeup1">
  71.         </p>
  72.         </div>
  73.         <hr>
  74.         <div class="c2"
  75.         onclick="pchild=this.getElementsByTagName('p'); if(pchild[0].style.visibility!='hidden'){pchild[0].style.visibility='hidden'; pchild[0].style.height='0';}else{pchild[0].style.visibility=''; pchild[0].style.height=''}"><h2>Qui ?</h2>
  76.         <p style="">Produit par 2 ingénieurs d'Intel (Marcian Hoff et Federico Faggin), il a été commandité par la société japonaise Busicom.<br>
  77.             <br>
  78.             <img src="images/questions/federico_faggin.jpg" alt="Federico Faggin aurait dû s'afficher" title="Federico Faggin" width="175" class="sizeup2">
  79.             <img src="images/questions/marcian_hoff.jpg" alt="Marcian Hoff aurait dû s'afficher" title="Marcian Hoff" width="158" class="sizeup2"><br>
  80.             <!--on ne peut pas rentrer de figure et donc de légende dans cet évènement-->
  81.             <em>Dans l'ordre: <strong>Federico Faggin</strong> et <strong>Marcian Hoff</strong></em>
  82.         </p>
  83.         </div>
  84.         <hr>
  85.         <div class="c3"
  86.          onclick="pchild=this.getElementsByTagName('p'); if(pchild[0].style.visibility!='hidden'){pchild[0].style.visibility='hidden'; pchild[0].style.height='0';}else{pchild[0].style.visibility=''; pchild[0].style.height=''}"><h2>Quand ?</h2>
  87.         <p style="">Son architecture a été réalisé en 1969 et la première production pour Busicom a été en Mars 1971.<br>
  88.             <br>
  89.             <img src="images/questions/architecture.jpg" alt="L'architecture de l'Intel 4004 aurait dû s'afficher" title="Architecture Intel 4004" width="250" class="sizeup3">
  90.         </p>
  91.         </div>
  92.         <hr>
  93.         <div class="c4"
  94.          onclick="pchild=this.getElementsByTagName('p'); if(pchild[0].style.visibility!='hidden'){pchild[0].style.visibility='hidden'; pchild[0].style.height='0';}else{pchild[0].style.visibility=''; pchild[0].style.height=''}"><h2>Où ?</h2>
  95.         <p style="">Il a été produit par une entreprise japonaise mais a été produit dans le monde entier.<br>
  96.         <br>
  97.         <img src="images/questions/monde.jpg" alt="Une image du monde aurait dû s'afficher" title="Monde entier" width="225" class="sizeup1">
  98.         </p>
  99.         </div>
  100.         <hr>
  101.         <div class="c5" id="c5"
  102.          onclick="pchild=this.getElementsByTagName('p'); if(pchild[0].style.visibility!='hidden'){pchild[0].style.visibility='hidden'; pchild[0].style.height='0';}else{pchild[0].style.visibility=''; pchild[0].style.height=''}"><h2>Comment ?</h2>
  103.         <p style="">Il avait une fréquence de 740kHz ainsi qu'une finesse de gravure de 10µm. Son architecture était en 4 bits et il a été produit en céramique. Il fonctionnait avec de la mémoire vive.<br>
  104.         <br>
  105.         <img src="images/questions/inside4004.png" alt="Une présentation de l'Intel 4004 aurait dû s'afficher" title="Inside 4004" width="250" class="sizeup3">
  106.         </p>
  107.         </div>
  108.         <hr>
  109.         <div class="c6"
  110.          onclick="pchild=this.getElementsByTagName('p'); if(pchild[0].style.visibility!='hidden'){pchild[0].style.visibility='hidden'; pchild[0].style.height='0';}else{pchild[0].style.visibility=''; pchild[0].style.height=''}"><h2>Pourquoi ?</h2>
  111.         <p style="">Il a été fait pour pouvoir réaliser des opérations compliqués tel une calculatrice. Il était le centre des calculs.<br>
  112.         <br>
  113.         <img src="images/questions/cpu.png" alt="L'image d'un CPU aurait dû s'afficher" title="CPU" width="250" class="sizeup3">
  114.         </p>
  115.         </div>
  116.         <hr>
  117.         </div>
  118.         <a id="sources"> </a>
  119.         <h2> <strong> Sources : </strong></h2>
  120.         <ol>
  121.             <li>Encyclopédie <a href="https://fr.wikipedia.org/wiki/Intel_4004" target="_blank" class="lien">Wikipédia</a></li>
  122.             <li>Documentation CSS <a href="https://developer.mozilla.org/fr/docs/Web/CSS" target="_blank" class="lien">MDN Web Doc</a></li>
  123.         </ol>
  124.         <br>
  125.         <!--Essai raté
  126.         <div class="c7"
  127.         onclick="pchild.this.getElementsByTagName('p'); if(pchild[0].style.width!=225){pchild[0].style.width='225';}else{pchild[0].style.width='250'}"><h2>Test</h2>
  128.         <p style="">
  129.             <img src="images/questions/intel4004.jpg" width="225">
  130.         </p>
  131.         </div>
  132.         -->
  133.         <hr>   
  134.         <p>Cette page a été crée par Tino</p><p>            
  135.         <!--Ci-dessous le lien qui mène à la première ancre du document : debut-->
  136.         <a href="#debut" class="lien">Retour haut de page</a><br>
  137.         <button class="w3-btn w3-teal">Quoi</button>
  138.         </p><hr>
  139.         <!--
  140.         <script type="text/javascript" src="jsnav.js">
  141.                     // Quand quelqu'un scroll, la fonction myFunction est utilisé
  142.                     window.onscroll = function() {myFunction()};
  143.  
  144.                     // Récupère la navbar
  145.                     var navbar = document.getElementById("navbar");
  146.  
  147.                     // Récupère la position de la navbar
  148.                     var sticky = navbar.offsetTop;
  149.  
  150.                     // Add the sticky class to the navbar when you reach its scroll position. Remove "sticky" when you leave the scroll position
  151.                     function myFunction() {
  152.                       if (window.pageYOffset >= sticky) {
  153.                         navbar.classList.add("sticky")
  154.                       } else {
  155.                         navbar.classList.remove("sticky");
  156.                       }
  157.                 }
  158.         </script>
  159.         -->
  160. </body>
  161. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!