Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link href="//code.jquery.com/ui/1.9.2/themes/humanity/jquery-ui.css" rel="stylesheet" type="text/css" />
<script src="//code.jquery.com/jquery-1.8.3.min.js"></script>
<script src="//code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
    <title>Style a HTML Table using jQuery UI (by DevCurry.com)</title>
    <link type="text/css" rel="stylesheet"
        href="http://jqueryui.com/themes/base/ui.all.css" />
    <script type="text/javascript"
        src="http://jqueryui.com/js/jquery.js"></script>
      <script type="text/javascript">
          $(document).ready(function () {
              $('#switcher').themeswitcher();
          });
  </script>
</head>
<body style="font-size:70%;">
<script type="text/javascript"
  src="http://jqueryui.com/themeroller/themeswitchertool/">
</script>
<div id="switcher"></div>
<br /><br />
<table id="myTable" border="0" style="border-collapse:collapse" class="ui-widget" align="center">
<thead class="ui-widget-header">
    <tr>
        <th>Column 1</th>
        <th>Column 2</th>
        <th>Column 3</th>
    </tr>
</thead>
<tbody class="ui-widget-content">
    <tr>
        <td>Row 0 Column 0</td>
        <td >Row 0 Column 1</td>
        <td >Row 0 Column 2</td>
    </tr>
    <tr >
        <td>Row 1 Column 0</td>
        <td>Row 1 Column 1</td>
        <td>Row 1 Column 2</td>
    </tr>
    <tr >
        <td>Row 2 Column 0</td>
        <td>Row 2 Column 1</td>
        <td>Row 2 Column 2</td>
    </tr>
</tbody>
  </table>
<br />
</body>
</html>
 
​
Output

This bin was created anonymously and its free preview time has expired (learn why). — Get a free unrestricted account

Dismiss x
public
Bin info
anonymouspro
0viewers