Tabs

<!DOCTYPE html>
<html lang="ja">
  <head>
    <meta charset="utf-8">
    <title>jQuery UI</title>
    <link rel="stylesheet" href="jquery-ui.min.css">
    <script src="./external/jquery/jquery.js"></script>
    <script src="jquery-ui.min.js"></script>
    <style>
    .ui-selected {
      background: red;
    }
  </style>
  </head>
  <body>
  <div id="tabs">
  
  <ul>
    <li><a href="#menu1">Menu1</a></li>
    <li><a href="#menu2">Menu2</a></li>
    <li><a href="#menu3">Menu3</a></li>
  </ul>

  <div id="menu1">menu 1</div>
  <div id="menu2">menu 2</div>
  <div id="menu3">menu 3</div>
  </div>
  <script>
    $(function(){
      $('#tabs').tabs();
      });
  </script>
  </body>
</html>