Nerviie

HTML EXPOCIC

Mar 26th, 2019
193
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 6.01 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.     <title>ExpoCIC</title>
  5.     <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
  6.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7.     <meta charset="utf-8">
  8.     <style type="text/css">
  9.         #tabela{
  10.             border-collapse: collapse;
  11.             margin: auto;
  12.             background-color: crimson;
  13.             cursor:crosshair;
  14.         }
  15.         #tabela2{
  16.             border-collapse: collapse;
  17.             margin: auto;
  18.             background-color: brown;
  19.             color: white;
  20.         }
  21.         #fundo{
  22.             background-image: url(https://cdn.hipwallpaper.com/i/91/70/bUpl9r.jpg);
  23.             font-family: sans-serif;
  24.         }
  25.         #titulo{
  26.             color: #ff4d4d;
  27.             font-family: sans-serif;
  28.             font-size: 50px;
  29.             text-align: center;
  30.             margin: auto;      
  31.             text-shadow: 1px 1px 2px white, 0 0 25px gray, 0 0 5px white;
  32.         }
  33.         button:hover{
  34.             background-color:aqua;
  35.             color:#000;
  36.             cursor: pointer;
  37.         }
  38.         button{
  39.             font-size:16px;
  40.             background-color:#00cccc;
  41.             color: white;
  42.             border-radius:20px;
  43.             border:1px solid white;
  44.             padding-left:30px;
  45.             padding-right:30px;
  46.             padding-bottom:10px;
  47.             padding-top:10px;
  48.             margin:auto;
  49.         }
  50.         button:disabled{
  51.             background-color:gray;
  52.             color: black;
  53.         }
  54.         p{
  55.             text-align:center;
  56.         }
  57.         tr, td{
  58.             margin:auto;
  59.             border:2px solid black;
  60.             width:100px;
  61.             height:70px;
  62.             font-size:24px;
  63.             text-align:center;
  64.             vertical-align:middle;  
  65.         }
  66.         .td:hover{
  67.             background-color:white;
  68.             color:#000;
  69.         }
  70.         .escolha{
  71.             background-color: #8cff66;
  72.             box-shadow: 1px 1px 1px 1px red inset;
  73.         }
  74.         #tabela3{
  75.             border-collapse: collapse;
  76.             background-color: brown;
  77.             margin: auto;
  78.             color: white;
  79.         }
  80.         #fm1{
  81.             visibility: visible;
  82.         }
  83.         #fg{
  84.             visibility: hidden;
  85.             color: white;
  86.             text-shadow: 1px 1px 2px white, 0 0 25px gray, 0 0 5px white;
  87.         }
  88.         #crl{
  89.             visibility: visible;
  90.         }
  91.     </style>
  92. </head>
  93. <body id="fundo">
  94.     <?php
  95.        $bd_host="localhost";
  96.        $bd_user="root";
  97.        $bd_password="";
  98.        $bd_database="14062";
  99.        $mysqli = new mysqli($bd_host,$bd_user,$bd_password,$bd_database);
  100.        if ($mysqli->connect_error) {
  101.             die('Erro: ('. $mysqli->connect_errno .') '. $mysqli->connect_error);
  102.         }
  103.  
  104.     ?>  
  105.     <div id="crl">
  106.     <h1 id="titulo"><strong>Jogo da Bomba</strong></h1>
  107.     <br><br>
  108.     <table id="tabela">
  109.         <tr>
  110.             <td class="td" id="t0" onClick="rt(0)">&nbsp;</td>
  111.             <td class="td" id="t1" onClick="rt(1)">&nbsp;</td>
  112.             <td class="td" id="t2" onClick="rt(2)">&nbsp;</td>
  113.             <td class="td" id="t3" onClick="rt(3)">&nbsp;</td>
  114.             <td class="td" id="t4" onClick="rt(4)">&nbsp;</td>
  115.             <td class="td" id="t5" onClick="rt(5)">&nbsp;</td>
  116.         </tr>
  117.         <tr>
  118.             <td class="td" id="t6" onClick="rt(6)">&nbsp;</td>
  119.             <td class="td" id="t7" onClick="rt(7)">&nbsp;</td>
  120.             <td class="td" id="t8" onClick="rt(8)">&nbsp;</td>
  121.             <td class="td" id="t9" onClick="rt(9)">&nbsp;</td>
  122.             <td class="td" id="t10" onClick="rt(10)">&nbsp;</td>
  123.             <td class="td" id="t11" onClick="rt(11)">&nbsp;</td>
  124.         </tr>
  125.         <tr>
  126.             <td class="td" id="t12" onClick="rt(12)">&nbsp;</td>
  127.             <td class="td" id="t13" onClick="rt(13)">&nbsp;</td>
  128.             <td class="td" id="t14" onClick="rt(14)">&nbsp;</td>
  129.             <td class="td" id="t15" onClick="rt(15)">&nbsp;</td>
  130.             <td class="td" id="t16" onClick="rt(16)">&nbsp;</td>
  131.             <td class="td" id="t17" onClick="rt(17)">&nbsp;</td>
  132.         </tr>
  133.         <tr>
  134.             <td class="td" id="t18" onClick="rt(18)">&nbsp;</td>
  135.             <td class="td" id="t19" onClick="rt(19)">&nbsp;</td>
  136.             <td class="td" id="t20" onClick="rt(20)">&nbsp;</td>
  137.             <td class="td" id="t21" onClick="rt(21)">&nbsp;</td>
  138.             <td class="td" id="t22" onClick="rt(22)">&nbsp;</td>
  139.             <td class="td" id="t23" onClick="rt(23)">&nbsp;</td>
  140.         </tr>
  141.         <tr>
  142.             <td class="td" id="t24" onClick="rt(24)">&nbsp;</td>
  143.             <td class="td" id="t25" onClick="rt(25)">&nbsp;</td>
  144.             <td class="td" id="t26" onClick="rt(26)">&nbsp;</td>
  145.             <td class="td" id="t27" onClick="rt(27)">&nbsp;</td>
  146.             <td class="td" id="t28" onClick="rt(28)">&nbsp;</td>
  147.             <td class="td" id="t29" onClick="rt(29)">&nbsp;</td>
  148.         </tr>
  149.     </table>
  150.     <br>
  151.     <p><button id="butao" onClick="clica()">Jogar!</button></p>
  152.     <table id="tabela2">
  153.         <tr>
  154.             <td>&#128163;</td>
  155.             <td>&#x23F1;</td>
  156.             <td>&#x1F468;&#x200D;&#x1F692;</td>
  157.         </tr>
  158.         <tr>
  159.             <td id="w1">0</td>
  160.             <td id="w2">0</td>
  161.             <td id="w3">0</td>
  162.         </tr>
  163.     </table>
  164.     <table id="tabela3">
  165.         <tr>
  166.             <td>Vitórias</td>
  167.             <td>Derrotas</td>
  168.         </tr>
  169.         <tr>
  170.             <td id="o1">0</td>
  171.             <td id="o2">0</td>
  172.         </tr>
  173.     </table>
  174.     </div>
  175.     <script src="jex.js"></script>
  176.     <h1 id="fg">Ganhou!! Quer inserir o seu numero de cliques na tabela de recordes?? </h1>
  177.     <form id="fm1">
  178.         <input type="visible" name="cliques" id="cli" value="0">
  179.     </form>
Advertisement
Add Comment
Please, Sign In to add comment