SoFunction
Updated on 2025-03-03

Use BootStrap to achieve table interlaced rows and hover color change, and scroll bars appear when needed

I won’t say much nonsense, I will just post the code to you. The specific code is as follows:

<%@ page language="java" import=".*" pageEncoding="UTF-8"%>
<html> 
<head>
 <!-- IntroducedcssCompressed files -->
 <link rel="stylesheet" type="text/css"
  href="<%=()%>/resources/css/">
 </head>
 <body>
 <div class="table-responsive">
  <table class="table table-hover table-bordered">
  <caption>
   Border table layout
  </caption>
  <thead>
   <tr style="background: silver;">
   <th>
    name
   </th>
   <th>
    City
   </th>
   <th>
    password
   </th>
   <th>
    name
   </th>
   <th>
    City
   </th>
   <th>
    password
   </th>
   </tr>
  </thead>
  <tbody>
   <tr class="success">
   <td>
    Tanmay
   </td>
   <td>
    Bangalore
   </td>
   <td>
    560001
   </td>
   <td>
    Tanmay
   </td>
   <td>
    Bangalore
   </td>
   <td>
    560001
   </td>
   </tr>
   <tr class="active">
   <td>
    Sachin
   </td>
   <td>
    Mumbai
   </td>
   <td>
    400003
   </td>
   <td>
    Tanmay
   </td>
   <td>
    Bangalore
   </td>
   <td>
    560001
   </td>
   </tr>
   <tr class="warning">
   <td>
    Uma
   </td>
   <td>
    Pune
   </td>
   <td>
    411027
   </td>
   <td>
    Tanmay
   </td>
   <td>
    Bangalore
   </td>
   <td>
    560001
   </td>
   </tr>
   <tr class="danger">
   <td>
    Uma
   </td>
   <td>
    Pune
   </td>
   <td>
    411027
   </td>
   <td>
    Tanmay
   </td>
   <td>
    Bangalore
   </td>
   <td>
    560001
   </td>
   </tr>
  </tbody>
  </table>
 </div>
 <!-- Finally introducedjs,Improve page loading speed ,Since here isbootstrap3,sojqueryThe file must be1.9.1The above version-->
 <script type="text/javascript" language="javascript"
  src='<%=()%>/js/bootstrap/jquery-1.9.'>
</script>
 <!-- IntroducedjsCompressed files -->
 <script type="text/javascript" language="javascript"
  src='<%=()%>/js/bootstrap/'>
</script>
 </body>
</html>
</pre>
<pre name="code" class="html">

The above is what the editor introduced to you using BootStrap to achieve interlaced and hover color change, and scroll bars appear when needed. I hope it will be helpful to everyone. If you have any questions, please leave me a message and the editor will reply to everyone in time. Thank you very much for your support for my website!