Difference between revisions of "Team:William and Mary/Team"

Line 5: Line 5:
 
<html>
 
<html>
  
−
<div class="container">
+
<head>
−
  <div class="jumbotron">
+
<title>About Us</title>
−
    <h1>Description of Our Project</h1>
+
 
−
  </div>
+
<style type="text/css">
−
<!--add description here-->
+
 
−
  <p></p>  
+
    </style>
−
</div>
+
</head>
 +
<body style="height:1000px">
 +
 
 +
<!-- Title -->
 +
<div class="container">
 +
 
 +
<div class="jumbotron">
 +
<h1>About Us</h1>
 +
<p><font size="+2">Meet the William and Mary iGEM team for the 2018 year!</font></p>
 +
</div>
 +
</div>
 +
 
 +
<!-- carousel that switches through pages of people in our team detailing about us-->
 +
<div class="container">
 +
<br>
 +
<div id="myCarousel" class="carousel slide" data-ride="carousel">
 +
<!-- Indicators- they are the little dots at the bottom on the carousel-->
 +
    <ol class="carousel-indicators">
 +
      <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
 +
      <li data-target="#myCarousel" data-slide-to="1"></li>
 +
      <li data-target="#myCarousel" data-slide-to="2"></li>
 +
      <li data-target="#myCarousel" data-slide-to="3"></li>
 +
      <li data-target="#myCarousel" data-slide-to="4"></li>
 +
      <li data-target="#myCarousel" data-slide-to="5"></li>
 +
      <li data-target="#myCarousel" data-slide-to="6"></li>
 +
      <li data-target="#myCarousel" data-slide-to="7"></li>
 +
      <li data-target="#myCarousel" data-slide-to="8"></li>
 +
      <li data-target="#myCarousel" data-slide-to="9"></li>
 +
      <li data-target="#myCarousel" data-slide-to="10"></li>
 +
      <li data-target="#myCarousel" data-slide-to="11"></li>
 +
    </ol>
 +
 
 +
    <!-- Wrapper for slides - to limit the size of the slides-->
 +
    <div class="carousel-inner" role="listbox">
 +
 
 +
      <div class="item active">
 +
        <img src="https://static.igem.org/mediawiki/2018/c/c6/T--William_and_Mary--black.png" alt="Ethan Jones" width="500" height="500">
 +
        <div class="carousel-caption">
 +
          <h3>Ethan Jones</h3>
 +
          <p>Add info here.</p>
 +
        </div>
 +
      </div>
 +
 
 +
      <div class="item">
 +
        <img src="jessica.jpg" alt="Jessica Laury" width="460" height="345">
 +
        <div class="carousel-caption">
 +
          <h3>Jessica Laury</h3>
 +
          <p>Add info here.</p>
 +
        </div>
 +
      </div>
 +
   
 +
      <div class="item">
 +
        <img src="yashna.jpg" alt="Yashna Verma" width="460" height="345">
 +
        <div class="carousel-caption">
 +
          <h3>Yashna Verma</h3>
 +
          <p>Add info here.</p>
 +
        </div>
 +
      </div>
 +
 
 +
      <div class="item">
 +
        <img src="tinh.jpg" alt="Tinh Son" width="460" height="345">
 +
        <div class="carousel-caption">
 +
          <h3>Tinh Son</h3>
 +
          <p>Add info here.</p>
 +
        </div>
 +
      </div>
 +
 
 +
              <div class="item">
 +
        <img src="https://static.igem.org/mediawiki/2018/8/84/T--William_and_Mary--xiangyi.jpg" alt="Xiangyi Fang" width="800" height="533">
 +
        <div class="carousel-caption">
 +
          <h3>Xiangyi Fang</h3>
 +
        </div>
 +
      </div>
 +
 
 +
      <div class="item">
 +
        <img src="chengwu.jpg" alt="Chengwu Shen" width="460" height="345">
 +
        <div class="carousel-caption">
 +
          <h3>Chengwu Shen</h3>
 +
          <p>Add info here.</p>
 +
        </div>
 +
      </div>
 +
 
 +
      <div class="item">
 +
        <img src="hanmi.jpg" alt="Hanmi Zou" width="460" height="345">
 +
        <div class="carousel-caption">
 +
          <h3>Hanmi Zou</h3>
 +
          <p>Add info here.</p>
 +
        </div>
 +
      </div>
 +
 
 +
      <div class="item">
 +
        <img src="adam.jpg" alt="Adam Oliver" width="460" height="345">
 +
        <div class="carousel-caption">
 +
          <h3>Adam Oliver</h3>
 +
          <p>Add info here.</p>
 +
        </div>
 +
      </div>
 +
 
 +
      <div class="item">
 +
        <img src="julia.jpg" alt="Julia Urban" width="460" height="345">
 +
        <div class="carousel-caption">
 +
          <h3>Julia Urban</h3>
 +
          <p>Add info here.</p>
 +
        </div>
 +
      </div>
 +
 
 +
      <div class="item">
 +
        <img src="lillian.jpg" alt="Lillian Parr" width="460" height="345">
 +
        <div class="carousel-caption">
 +
          <h3>Lillian Parr</h3>
 +
          <p>Add info here.</p>
 +
        </div>
 +
      </div>
 +
 
 +
      <div class="item">
 +
        <img src="stephanie.jpg" alt="Stephanie Do" width="460" height="345">
 +
        <div class="carousel-caption">
 +
          <h3>Stephanie Do</h3>
 +
          <p>Add info here.</p>
 +
        </div>
 +
      </div>
 +
 
 +
    </div>
 +
 
 +
<!-- Left and right controls -->
 +
    <a class="left carousel-control" href="#myCarousel" data-slide="prev">
 +
      <span class="glyphicon glyphicon-chevron-left"></span>
 +
      <span class="sr-only">Previous</span>
 +
    </a>
 +
    <a class="right carousel-control" href="#myCarousel" data-slide="next">
 +
      <span class="glyphicon glyphicon-chevron-right"></span>
 +
      <span class="sr-only">Next</span>
 +
    </a>
 +
  </div>
 +
</div>
  
 
</html>
 
</html>
 
{{William_and_Mary/SOURCE JS}}
 
{{William_and_Mary/SOURCE JS}}

Revision as of 14:24, 28 June 2018

About Us

About Us

Meet the William and Mary iGEM team for the 2018 year!