Difference between revisions of "Team:SIAT-SCIE/Home"

Line 8: Line 8:
 
         margin-bottom: -5px;
 
         margin-bottom: -5px;
 
     }
 
     }
 
+
     .bdimg img{
     .titlecomic {
+
        height: 400px;
         width: 1263px;
+
         width: 500px;
 +
        padding: 50px;
 +
       
 +
        margin-right:0px;
 
     }
 
     }
 
+
     .bdwl {
     #_footer p {
+
          
         text-align: center;
+
        width: 400px;
 +
        float: left;
 +
        padding-left: 117px;
 +
        padding-right:117px;
 +
        padding-top: 40px;
 
     }
 
     }
 +
   
 +
    .bdwr {
 +
       
 +
        width: 400px;
 +
        float:right;
 +
        padding-left:117px;
 +
        padding-right:117px;
 +
        padding-top:40px;
 +
    }
 +
    .block {
 +
        margin-bottom:100px;
 +
        border-bottom:black solid 5px;
 +
    }
 +
    #_footer{
 +
        text-align:center;
 +
    }
 
</style>
 
</style>
<div id="body">
+
    <div id="body">
    <div id="comics">
+
        <div id="comics">
        <p>
+
            <p>
            <img src="https://static.igem.org/mediawiki/2017/0/05/Team-SIAT-SCIE.jpeg" alt="titlecomic" class="titlecomic  />
+
                <img src="https://static.igem.org/mediawiki/2017/0/05/Team-SIAT-SCIE.jpeg" alt="titlecomic" class="titlecomic" />
            <!--also not sure if the image should be the back ground or the seperate one-->
+
                <!--also not sure if the image should be the back ground or the seperate one-->
        </p>
+
            </p>
    </div>
+
        </div>
    <div id="basic_description">
+
        <div id="basic_description">
        <p>
+
            <div id="bd1" class="block">
             <img src="https://static.igem.org/mediawiki/2017/c/cd/SIAT-SCIE%EF%BC%9Aproject%E2%80%94%E2%80%94testing.jpg" alt="discription" />
+
                <div class="bdwl">
        </p>
+
                    <!--basic description writting right-->
    </div>
+
                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse iaculis tempor nibh, aliquet suscipit nibh. Vivamus nec ante orci. Proin eu lectus sit amet purus vehicula blandit. In hac habitasse platea dictumst. Mauris sagittis sem in orci aliquam, id euismod ipsum congue. Morbi bibendum libero risus, et rhoncus mi volutpat a. Aliquam maximus sem eu mauris tempus, at porta sem blandit. Sed ac eleifend mauris. Proin tempor velit vel mauris bibendum gravida. Integer mollis placerat facilisis. Curabitur sagittis, tellus id feugiat aliquet, tellus magna iaculis nulla, vel lacinia lectus tellus a metus. Fusce sed ipsum ac sem egestas consequat imperdiet a turpis. Donec bibendum nisi et felis mollis, nec viverra urna elementum. Proin tincidunt turpis sit amet nunc posuere, non aliquet libero consectetur. Nunc a ex est. Proin convallis, nisl eget pharetra fermentum, metus sem faucibus quam, eu euismod neque turpis et purus.</p>
    <div id="_footer">
+
                </div>
         <p>@2017 IGEM  SIAT-SCIE  All right reserved</p>
+
                <div class="bdimg"  id="bdp1"><!--basic description picture 1-->
        <p>Our Wechat Official Accounts: SIATxSCIE</p>
+
                    <p><img src="https://static.igem.org/mediawiki/2017/2/2b/SIAT-SCIE_sample.png" alt="basic_discription1"/></p>
 +
               
 +
                </div>
 +
 
 +
               
 +
              
 +
            </div>
 +
            <div id="bd2" class="block">
 +
                <div class="bdwr">
 +
                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse iaculis tempor nibh, aliquet suscipit nibh. Vivamus nec ante orci. Proin eu lectus sit amet purus vehicula blandit. In hac habitasse platea dictumst. Mauris sagittis sem in orci aliquam, id euismod ipsum congue. Morbi bibendum libero risus, et rhoncus mi volutpat a. Aliquam maximus sem eu mauris tempus, at porta sem blandit. Sed ac eleifend mauris. Proin tempor velit vel mauris bibendum gravida. Integer mollis placerat facilisis. Curabitur sagittis, tellus id feugiat aliquet, tellus magna iaculis nulla, vel lacinia lectus tellus a metus. Fusce sed ipsum ac sem egestas consequat imperdiet a turpis. Donec bibendum nisi et felis mollis, nec viverra urna elementum. Proin tincidunt turpis sit amet nunc posuere, non aliquet libero consectetur. Nunc a ex est. Proin convallis, nisl eget pharetra fermentum, metus sem faucibus quam, eu euismod neque turpis et purus.</p>
 +
                </div>
 +
                <div class="bdimg" id="bdp2">
 +
                    <p><img src="https://static.igem.org/mediawiki/2017/2/2b/SIAT-SCIE_sample.png" alt="basic_discription2" /></p>
 +
                </div>
 +
               
 +
            </div>
 +
            <div id="bd3" class="block">
 +
                <div class="bdwl">
 +
                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse iaculis tempor nibh, aliquet suscipit nibh. Vivamus nec ante orci. Proin eu lectus sit amet purus vehicula blandit. In hac habitasse platea dictumst. Mauris sagittis sem in orci aliquam, id euismod ipsum congue. Morbi bibendum libero risus, et rhoncus mi volutpat a. Aliquam maximus sem eu mauris tempus, at porta sem blandit. Sed ac eleifend mauris. Proin tempor velit vel mauris bibendum gravida. Integer mollis placerat facilisis. Curabitur sagittis, tellus id feugiat aliquet, tellus magna iaculis nulla, vel lacinia lectus tellus a metus. Fusce sed ipsum ac sem egestas consequat imperdiet a turpis. Donec bibendum nisi et felis mollis, nec viverra urna elementum. Proin tincidunt turpis sit amet nunc posuere, non aliquet libero consectetur. Nunc a ex est. Proin convallis, nisl eget pharetra fermentum, metus sem faucibus quam, eu euismod neque turpis et purus.</p>
 +
                </div>
 +
                <div class="bdimg" id="bdp3">
 +
                    <p><img src="https://static.igem.org/mediawiki/2017/2/2b/SIAT-SCIE_sample.png" alt="basic_discription3"  /></p>
 +
                </div>
 +
               
 +
            </div>
 +
            <div id="bd4" class="block">
 +
                <div class="bdwr">
 +
                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse iaculis tempor nibh, aliquet suscipit nibh. Vivamus nec ante orci. Proin eu lectus sit amet purus vehicula blandit. In hac habitasse platea dictumst. Mauris sagittis sem in orci aliquam, id euismod ipsum congue. Morbi bibendum libero risus, et rhoncus mi volutpat a. Aliquam maximus sem eu mauris tempus, at porta sem blandit. Sed ac eleifend mauris. Proin tempor velit vel mauris bibendum gravida. Integer mollis placerat facilisis. Curabitur sagittis, tellus id feugiat aliquet, tellus magna iaculis nulla, vel lacinia lectus tellus a metus. Fusce sed ipsum ac sem egestas consequat imperdiet a turpis. Donec bibendum nisi et felis mollis, nec viverra urna elementum. Proin tincidunt turpis sit amet nunc posuere, non aliquet libero consectetur. Nunc a ex est. Proin convallis, nisl eget pharetra fermentum, metus sem faucibus quam, eu euismod neque turpis et purus.</p>
 +
                </div>
 +
                <div class="bdimg" id="bdp4">
 +
                    <p><img src="https://static.igem.org/mediawiki/2017/2/2b/SIAT-SCIE_sample.png" alt="basic_discription4" /></p>
 +
                </div>
 +
               
 +
            </div>
 +
         </div>
 +
        <div id="_footer">
 +
            <p>@2017 IGEM  SIAT-SCIE  All right reserved</p>
 +
            <p>Our Wechat Official Accounts: SIATxSCIE</p>
 +
        </div>
 
     </div>
 
     </div>
</div>
 
 
</html>
 
</html>

Revision as of 15:06, 2 August 2017

titlecomic

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse iaculis tempor nibh, aliquet suscipit nibh. Vivamus nec ante orci. Proin eu lectus sit amet purus vehicula blandit. In hac habitasse platea dictumst. Mauris sagittis sem in orci aliquam, id euismod ipsum congue. Morbi bibendum libero risus, et rhoncus mi volutpat a. Aliquam maximus sem eu mauris tempus, at porta sem blandit. Sed ac eleifend mauris. Proin tempor velit vel mauris bibendum gravida. Integer mollis placerat facilisis. Curabitur sagittis, tellus id feugiat aliquet, tellus magna iaculis nulla, vel lacinia lectus tellus a metus. Fusce sed ipsum ac sem egestas consequat imperdiet a turpis. Donec bibendum nisi et felis mollis, nec viverra urna elementum. Proin tincidunt turpis sit amet nunc posuere, non aliquet libero consectetur. Nunc a ex est. Proin convallis, nisl eget pharetra fermentum, metus sem faucibus quam, eu euismod neque turpis et purus.

basic_discription1

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse iaculis tempor nibh, aliquet suscipit nibh. Vivamus nec ante orci. Proin eu lectus sit amet purus vehicula blandit. In hac habitasse platea dictumst. Mauris sagittis sem in orci aliquam, id euismod ipsum congue. Morbi bibendum libero risus, et rhoncus mi volutpat a. Aliquam maximus sem eu mauris tempus, at porta sem blandit. Sed ac eleifend mauris. Proin tempor velit vel mauris bibendum gravida. Integer mollis placerat facilisis. Curabitur sagittis, tellus id feugiat aliquet, tellus magna iaculis nulla, vel lacinia lectus tellus a metus. Fusce sed ipsum ac sem egestas consequat imperdiet a turpis. Donec bibendum nisi et felis mollis, nec viverra urna elementum. Proin tincidunt turpis sit amet nunc posuere, non aliquet libero consectetur. Nunc a ex est. Proin convallis, nisl eget pharetra fermentum, metus sem faucibus quam, eu euismod neque turpis et purus.

basic_discription2

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse iaculis tempor nibh, aliquet suscipit nibh. Vivamus nec ante orci. Proin eu lectus sit amet purus vehicula blandit. In hac habitasse platea dictumst. Mauris sagittis sem in orci aliquam, id euismod ipsum congue. Morbi bibendum libero risus, et rhoncus mi volutpat a. Aliquam maximus sem eu mauris tempus, at porta sem blandit. Sed ac eleifend mauris. Proin tempor velit vel mauris bibendum gravida. Integer mollis placerat facilisis. Curabitur sagittis, tellus id feugiat aliquet, tellus magna iaculis nulla, vel lacinia lectus tellus a metus. Fusce sed ipsum ac sem egestas consequat imperdiet a turpis. Donec bibendum nisi et felis mollis, nec viverra urna elementum. Proin tincidunt turpis sit amet nunc posuere, non aliquet libero consectetur. Nunc a ex est. Proin convallis, nisl eget pharetra fermentum, metus sem faucibus quam, eu euismod neque turpis et purus.

basic_discription3

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse iaculis tempor nibh, aliquet suscipit nibh. Vivamus nec ante orci. Proin eu lectus sit amet purus vehicula blandit. In hac habitasse platea dictumst. Mauris sagittis sem in orci aliquam, id euismod ipsum congue. Morbi bibendum libero risus, et rhoncus mi volutpat a. Aliquam maximus sem eu mauris tempus, at porta sem blandit. Sed ac eleifend mauris. Proin tempor velit vel mauris bibendum gravida. Integer mollis placerat facilisis. Curabitur sagittis, tellus id feugiat aliquet, tellus magna iaculis nulla, vel lacinia lectus tellus a metus. Fusce sed ipsum ac sem egestas consequat imperdiet a turpis. Donec bibendum nisi et felis mollis, nec viverra urna elementum. Proin tincidunt turpis sit amet nunc posuere, non aliquet libero consectetur. Nunc a ex est. Proin convallis, nisl eget pharetra fermentum, metus sem faucibus quam, eu euismod neque turpis et purus.

basic_discription4