Advertisement
chetansoni

SU

Jan 11th, 2021
732
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 3.28 KB | None | 0 0
  1. <table class="table table-bordered" border="1" width="35%" cellpadding="0" cellspacing="0">
  2.     <tbody>
  3.         <tr>
  4.             <td class="no"><div class="blank">8</div></td>
  5.             <td class="no"></td>
  6.             <td class="br"></td>
  7.             <td class="no"></td>
  8.             <td class="no"></td>
  9.             <td class="br"></td>
  10.             <td class="no"></td>
  11.             <td class="no">1</td>
  12.             <td class="no">3</td>
  13.         </tr>
  14.         <tr>
  15.             <td class="no">9</td>
  16.             <td class="no"></td>
  17.             <td class="br"></td>
  18.             <td class="no"><div class="blank">1</div></td>
  19.             <td class="no"></td>
  20.             <td class="br"></td>
  21.             <td class="no"></td>
  22.             <td class="no"></td>
  23.             <td class="no">8</td>
  24.         </tr>
  25.         <tr>
  26.             <td class="bb"></td>
  27.             <td class="bb">1</td>
  28.             <td class="brbb">5</td>
  29.             <td class="bb"></td>
  30.             <td class="bb">8</td>
  31.             <td class="brbb"></td>
  32.             <td class="bb"></td>
  33.             <td class="bb"></td>
  34.             <td class="bb"></td>
  35.         </tr>
  36.         <tr>
  37.             <td class="no"></td>
  38.             <td class="no">9</td>
  39.             <td class="br"></td>
  40.             <td class="no"><div class="blank">8</div></td>
  41.             <td class="no"></td>
  42.             <td class="br">7</td>
  43.             <td class="no">4</td>
  44.             <td class="no"></td>
  45.             <td class="no">2</td>
  46.         </tr>
  47.         <tr>
  48.             <td class="no"></td>
  49.             <td class="no">6</td>
  50.             <td class="br"></td>
  51.             <td class="no"><div class="blank">9</div></td>
  52.             <td class="no"></td>
  53.             <td class="br">4</td>
  54.             <td class="no"><div class="blank">1</div></td>
  55.             <td class="no"><div class="blank">8</div></td>
  56.             <td class="no"></td>
  57.         </tr>
  58.         <tr>
  59.             <td class="bb"></td>
  60.             <td class="bb">8</td>
  61.             <td class="brbb"></td>
  62.             <td class="bb">2</td>
  63.             <td class="bb"></td>
  64.             <td class="brbb"></td>
  65.             <td class="bb">7</td>
  66.             <td class="bb">9</td>
  67.             <td class="bb"><div class="blank"></div></td>
  68.         </tr>
  69.         <tr>
  70.             <td class="no"></td>
  71.             <td class="no"></td>
  72.             <td class="br"></td>
  73.             <td class="no">6</td>
  74.             <td class="no">9</td>
  75.             <td class="br"></td>
  76.             <td class="no"></td>
  77.             <td class="no">2</td>
  78.             <td class="no"></td>
  79.         </tr>
  80.         <tr>
  81.             <td class="no"></td>
  82.             <td class="no"></td>
  83.             <td class="br"></td>
  84.             <td class="no"></td>
  85.             <td class="no">1</td>
  86.             <td class="br"></td>
  87.             <td class="no"></td>
  88.             <td class="no"></td>
  89.             <td class="no"></td>
  90.         </tr>
  91.         <tr>
  92.             <td class="no"></td>
  93.             <td class="no"></td>
  94.             <td class="br">8</td>
  95.             <td class="no">5</td>
  96.             <td class="no"></td>
  97.             <td class="br"></td>
  98.             <td class="no"></td>
  99.             <td class="no"></td>
  100.             <td class="no">1</td>
  101.         </tr>
  102.     </tbody>
  103. </table>
  104. <input type='button' id='hideshow' value='Show/Hide Answer'>
  105. <script src="https://code.jquery.com/jquery-1.4.2.js"></script>
  106. <script>
  107.     jQuery(document).ready(function(){
  108.         jQuery('#hideshow').live('click', function(event) {        
  109.              jQuery('.blank').toggle('show');
  110.         });
  111.     });
  112. </script>
  113. <style>
  114.     td > .blank{
  115.         display:none;
  116.         color:#fff;
  117.         font-weight: 800;
  118.         font-size:20px;
  119.         padding: 1px;
  120.         background-color:red;
  121.     }
  122.     td.no{
  123.         background-color: #fff;
  124.        
  125.     }
  126.     table tr td {
  127.         border:1px solid #ccc;
  128.         text-align: center;
  129.         padding: 10px;
  130.     }
  131.     table{
  132.         border:2px solid #4d4d4d;
  133.     }
  134.  
  135.     td.br{
  136.         border-right: 2px solid #4d4d4d;
  137.        
  138.        
  139.     }
  140.     td.bb{
  141.         border-bottom: 2px solid #4d4d4d;
  142.        
  143.     }
  144.     td.brbb {
  145.         border-bottom: 2px solid #4d4d4d;
  146.         border-right:2px solid #4d4d4d;
  147.        
  148.     }
  149. </style>
  150.  
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement