Difference between revisions of "Team:Tokyo-NoKoGen/Demo"

Line 25: Line 25:
 
}
 
}
  
−
div#overview {
+
div#overview {
−
width:600px;
+
width:600px;
−
height:300px;
+
height:300px;
−
margin-top:10px;
+
margin-top:10px;
−
background:#ffffff;
+
margin-left:10px;
−
      border:solid 1px #000000;
+
background:#ffffff;
−
display: inline-block; _display: inline;
+
      border:solid 1px #000000;
−
float:left;
+
display: inline-block; _display: inline;
−
}
+
float:left;
−
div#team {
+
}
−
width:250px;
+
div#team {
−
height:300px;
+
width:250px;
−
margin-top:-5px;
+
height:300px;
−
margin-right:10px;
+
margin-top:-5px;
−
background: #ffffff;
+
margin-right:10px;
−
      border:solid 1px #000000;
+
background: #ffffff;
−
float:right;
+
      border:solid 1px #000000;
−
}
+
float:right;
 +
}
 
div#box2 /*2段目の箱*/ {
 
div#box2 /*2段目の箱*/ {
 
width:900px;
 
width:900px;
Line 49: Line 50:
 
border:solid 1px;
 
border:solid 1px;
 
         position:absolute;
 
         position:absolute;
−
        top:340px;
+
      top:340px;
−
        left:0px;
+
      left:0px;
−
 
+
 
}
 
}
  
−
div#facebook {
+
div#facebook {
−
width:600px;
+
width:200px;
−
height:300px;
+
height:135px;
 +
      position:relative;
 +
left:15px;
 +
margin-top:10px;
 +
margin-left:20px;
 +
background:#ffffff;
 +
      border:solid 1px #000000;
 +
display: inline-block; _display: inline;
 +
display: table-cell;    /* ④ */ 
 +
　  vertical-align: middle;
 +
　  position:absolute;
 +
left:15px;
 +
}
 +
div#twitter {
 +
width:200px;
 +
height:135px;
 +
position:relative;
 +
left:15px;
 +
margin-top:300px;
 +
margin-left:20px;
 +
background:#ffffff;
 +
      border:solid 1px #000000;
 +
display: inline-block; _display: inline;
 +
display: table-cell;   
 +
    　 vertical-align: middle;　　
 +
    　 　}
 +
 
 +
div#project {
 +
width:650px;
 +
height:300px;
 +
margin-top:-290px;
 +
margin-right:10px;
 +
background: #ffffff;
 +
      border:solid 1px #000000;
 +
float:right;
 +
}
 +
div#box3 /*3段目の箱*/ {
 +
width:900px;
 +
height:330px;
 
margin-top:10px;
 
margin-top:10px;
−
background:#ffffff;
+
border:solid 1px;
−
      border:solid 1px #000000;
+
        position:absolute;
−
display: inline-block; _display: inline;
+
        top:400px
−
float:left;
+
}
−
}
+
div#Ache {
−
 
+
width:200px;
−
div#project {
+
height:300px;
−
width:250px;
+
margin-top:10px;
−
height:300px;
+
margin-left:10px;
−
margin-top:-5px;
+
background:#ffffff;
−
margin-right:10px;
+
      border:solid 1px #000000;
−
background: #ffffff;
+
display: inline-block; _display: inline;
−
      border:solid 1px #000000;
+
float:left;
−
float:right;
+
}
−
}
+
div#Human {
 +
width:200px;
 +
height:300px;
 +
margin-top:10px;
 +
margin-left:10px;
 +
background:#ffffff;
 +
      border:solid 1px #000000;
 +
display: inline-block; _display: inline;
 +
float:left;
 +
}
 +
div#Parts {
 +
width:200px;
 +
height:300px;
 +
margin-top:10px;
 +
margin-left:10px;
 +
background:#ffffff;
 +
      border:solid 1px #000000;
 +
display: inline-block; _display: inline;
 +
float:right;
 +
}
 +
      div#safety {
 +
width:200px;
 +
height:300px;
 +
margin-top:10px;
 +
margin-left:10px;
 +
background:#ffffff;
 +
      border:solid 1px #000000;
 +
display: inline-block; _display: inline;
 +
float:right;
 +
}
  
  
Line 168: Line 235:
 
<div id="box2"/*見えない2段目のボックス*/>　
 
<div id="box2"/*見えない2段目のボックス*/>　
 
<div id="facebook">
 
<div id="facebook">
−
   　　　　　　　 <img src="http://junk-blog.com/wp-content/uploads/2014/09/sample_image.jpg" alt="サンプル画像" width="550" height="250">
+
   　　　　　　　 <p>facebook</p>
−
   　　　　　　　　
+
  　　</div>
−
　　　</div>
+
  　　<div id="twitter">
 +
   　　　　　　　 <p>twitter</p>
 +
  　　</div>
 +
  　　
 
  　　 　<div id="project">
 
  　　 　<div id="project">
 
   　　　　　　<p>project</p>　  
 
   　　　　　　<p>project</p>　  
−
   　　　　　　　　
+
   　　　</div>
−
　　　</div>　
+
   
 +
      <div id="box3"/*見えない3段目のボックス*/>　　
 +
  　　<div id="Ache">
 +
  　　　　　　　 <p>Achievement</p>
 +
  　　</div>
 +
  　　<div id="Human">
 +
  　　　　　　　 <p>Human practice</p>
 +
  　　</div>
 +
  　　<div id="parts">
 +
  　　　　　　　 <p>Parts</p>
 +
  　　</div>
 +
  　　 <div id="safety">
 +
  　　　　　　　 <p>safety</p>
 +
  　　</div>
 +
  　　
 +
     
 +
      </div>
 +
     
 +
  　　　
 +
  　　　
 
  </div>　　　　　　　　
 
  </div>　　　　　　　　
 
  </div>
 
  </div>

Revision as of 15:24, 26 August 2015

　　
　 　　
　　　　　　　 サンプル画像 　　　　　　　　　　 　　　　
　　　　 　　
　

team

　　
　
　　　　　　　

facebook

　　
　　
　　　　　　　

twitter

　　
　　 　　 　
　　　　　　

project

　 　　　
　　 　　
　　　　　　　

Achievement

　　
　　
　　　　　　　

Human practice

　　
　　
　　　　　　　

Parts

　　
　　
　　　　　　　

safety