基于Bootstrap和jQuery的windows桌面布局模板

http://www.htmleaf.com/jQuery/Layout-Interface/201505151838.html

<div class="nav-bar">

  <div class="start">

    <a href="#" class="start-menu" id="full"><i class="fa fa-bars"></i></a>

  </div>

  <div class="nav-apps">

  </div>

  <div class="clock">

    <ul>

      <li id="hours"></li>

      <li id="point">:</li>

      <li id="min"></li>

      <li id="point">:</li>

      <li id="sec"></li>

    </ul>

    <div id="Date"></div>

  </div>

</div>

<div class="menu">

  <div class="submenu">

    <ul>

      <li><a href="#" onclick="openApp('settings', 'Settings', 'settings.html', 'fa-cogs')"><i class="fa fa-cogs"></i></a></li>

      <li><a href="#" onclick="openApp('users', 'users', 'users.html', 'fa-users')"><i class="fa fa-users"></i></a></li>

      <li><a href="#" onclick="openApp('time', 'Time preferences', 'time.html', 'fa-clock-o')"><i class="fa fa-clock-o"></i></a></li>

      <li><a href="#"><i class="fa fa-file-image-o"></i></a></li>

      <li><a href="#"><i class="fa fa-sign-out"></i></a></li>

    </ul>

  </div>

</div>

<div class="content">

  <div class="col-desktop">

    <div class="app-icon blue">

      <a href="#" ondblclick="openApp('settings', 'Settings', 'settings.html', 'fa-cogs', 800, 700, false)">

        <i class="fa fa-cogs"></i>Settings

      </a>

    </div>

      <div class="app-icon red">

      <a href="#" ondblclick="openApp('users', 'Users', 'users.html', 'fa-users')">

        <i class="fa fa-users"></i>Users

      </a>

    </div>

  </div>

  <div class="col-desktop">

    <div class="app-icon green">

      <a href="#" ondblclick="openApp('time', 'Time preferences', 'clock.php', 'fa-clock-o')">

        <i class="fa fa-clock-o"></i>Time

      </a>

    </div>

  </div>

</div>