View source for Sandbox ← Sandbox

{{bs label default}}
{{bs label success}}
{{bs label warning}}
{{bs label important}}
{{bs label info}}
{{bs label inverse}}

[[image:bsimage.jpg]]

[[Allegro]]

<html>

<script type="text/javascript">
    $(function () {
        $("[rel='tooltip']").tooltip();
    });
</script>

</html>


'MediaWiki:bootstrap-navbar', '[[MediaWiki:bootstrap-sidebar]]', and 'MediaWiki:bootstrap-footer' 
http://twitter.github.com/bootstrap/components.html
*[[Allegro Hand backup]]
*[[bootstrap testing]]



<html>
$('#example').tooltip(options)
<a href="#" data-toggle="tooltip" title="first tooltip">hover over me</a>
</html>

<html>

                <a href="#" class="thumbnail">
                  <img src="http://www.simlab.co.kr/Allegro-Hand-flash/Allegro_Hand_flash_05.png" alt="">
                </a>

          <h2>Default thumbnails</h2>
          <p>By default, Bootstrap's thumbnails are designed to showcase linked images with minimal required markup.</p>
          <div class="row-fluid">
            <ul class="thumbnails">
              <li class="span3">
                <a href="#" class="thumbnail">
                  <img src="http://www.simlab.co.kr/Allegro-Hand-flash/Allegro_Hand_flash_05.png" alt="">
                </a>
              </li>
              <li class="span3">
                <a href="#" class="thumbnail">
                  <img src="http://www.simlab.co.kr/Allegro-Hand-flash/Allegro_Hand_flash_05.png" alt="">
                </a>
              </li>
              <li class="span3">
                <a href="#" class="thumbnail">
                  <img src="http://www.simlab.co.kr/Allegro-Hand-flash/Allegro_Hand_flash_05.png" alt="">
                </a>
              </li>
              <li class="span3">
                <a href="http://twitter.github.com/bootstrap/customize.html" class="thumbnail">
                  <img src="http://www.simlab.co.kr/Allegro-Hand-flash/Allegro_Hand_flash_05.png" alt="">
                </a>
              </li>
            </ul>
          </div>

<ul class="thumbnails">  
        <li class="span5">  
          <div class="thumbnail">  
            <img src="http://www.simlab.co.kr/Allegro-Hand-flash/Allegro_Hand_flash_05.png" alt="product 1">  
            <div class="caption">  
              <h5>Product detail</h5>  
              <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore       magna aliqua.</p>  
              <p><a href="#" class="btn btn-success">Buy</a> <a href="#" class="btn btn-warning">Try</a></p>  
            </div>  
          </div>  
        </li>  
        <li class="span5">  
          <div class="thumbnail">  
            <img src="http://www.simlab.co.kr/Allegro-Hand-flash/Allegro_Hand_flash_05.png" alt="product 2">  
            <div class="caption">  
              <h5>Product detail</h5>  
              <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>  
              <p><a href="#" class="btn btn-success">Buy</a> <a href="#" class="btn btn-warning">Try</a></p>  
            </div>  
          </div>  
        </li>  
      </ul>  


<ul class="nav nav-pills">
  <li class="active">
    <a href="#">Home</a>
  </li>
  <li><a href="#">...</a></li>
  <li><a href="#">...</a></li>
</ul>

<div class="btn-group">
  <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
    Action
    <span class="caret"></span>
  </a>
  <ul class="dropdown-menu">
    <!-- dropdown menu links -->
  </ul>
</div>

<div class="hero-unit">
  <h1>Heading</h1>
</div>

<div class="progress">
  <div class="bar" style="width: 60%;"></div>
</div>

<div class="alert">
  <button type="button" class="close" data-dismiss="alert">&times;</button>
  <strong>Warning!</strong> Best check yo self, you're not looking too good.
</div>

<div class="hero-unit">
  <h1>Heading</h1>
  <p>Tagline</p>
  <p>
    <a class="btn btn-primary btn-large">
      Learn more
    </a>
  </p>
</div>

              <div id="myCarousel" class="carousel slide">
                <div class="carousel-inner">
                  <div class="item active">
                    <img src="http://www.deshow.net/d/file/cartoon/2008-12/bob-ross-landscape-painting-281-2.jpg" alt="">
                    <div class="carousel-caption">
                      <h4>First Thumbnail label</h4>
                      <p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
                    </div>
                  </div>
                  <div class="item">
                    <img src="http://www.deshow.net/d/file/cartoon/2008-12/bob-ross-landscape-painting-281-2.jpg" alt="">
                    <div class="carousel-caption">
                      <h4>Second Thumbnail label</h4>
                      <p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
                    </div>
                  </div>
                  <div class="item">
                    <img src="http://www.deshow.net/d/file/cartoon/2008-12/bob-ross-landscape-painting-281-2.jpg" alt="">
                    <div class="carousel-caption">
                      <h4>Third Thumbnail label</h4>
                      <p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
                    </div>
                  </div>
                </div>
                <a class="left carousel-control" href="#myCarousel" data-slide="prev">&lsaquo;</a>
                <a class="right carousel-control" href="#myCarousel" data-slide="next">&rsaquo;</a>
              </div>

</html>