Difference between revisions of "Team:DUT China B"

Line 3: Line 3:
 
<head>
 
<head>
 
<meta charset="UTF-8">
 
<meta charset="UTF-8">
 +
<title>Document</title>
 
<style>
 
<style>
*{
+
.div1{
padding: 0px;
+
 
margin: 0px;
+
            margin:0 auto;
}
+
 
div{
+
            background: #555;
padding: 0px;
+
 
margin: 0px;
+
            width:500px;
}
+
 
body{
+
            height:200px;
background-color: #def;
+
 
}
+
            border:2px solid #000;
#container{
+
 
width: 760px;
+
            border-radius:30px;
height: 160px;
+
 
margin: 100px auto;
+
            text-align: center;
}
+
 
.box{
+
            line-height: 200px;
float: left;
+
 
margin: 10px;
+
        }
width: 155px;
+
    .div1 h1{
height: 155px;
+
    color: #eee;
border: 3px solid #ccc;
+
    }
transform-style: preserve-3d;
+
transition: 1.5s;
+
position: relative;
+
}
+
.box:hover{
+
transform:rotateY(180deg);
+
}
+
.face{
+
width: 150px;
+
height: 150px;
+
position: absolute;
+
}
+
.front{
+
border: 2px solid #4b2518;
+
}
+
.back{
+
transform: rotateY(180deg);
+
background-color: #4b2518;
+
border: 2px solid #fff;
+
}
+
.back h3{
+
color: white;
+
text-align: center;
+
}
+
img{
+
width: 150px;
+
}
+
 
</style>
 
</style>
 
</head>
 
</head>
 
<body>
 
<body>
<div id="container">
+
<div>
<div class="box">
+
<div class="div1"><h1>DUT_China_B</h1></div>
<div class="face front"><img src="image/coffee1.jpg" alt="无法显示"></div>
+
<div class="face back">
+
<h3>拿铁咖啡</h3>
+
</div>
+
</div>
+
<div class="box">
+
<div class="face front"><img src="image/coffee2.jpg" alt="无法显示"></div>
+
<div class="face back">
+
<h3>卡布奇诺</h3>
+
</div>
+
</div>
+
<div class="box">
+
<div class="face front"><img src="image/coffee3.jpg" alt="无法显示"></div>
+
<div class="face back">
+
<h3>美式咖啡</h3>
+
</div>
+
</div>
+
<div class="box">
+
<div class="face front"><img src="image/coffee4.jpg" alt="无法显示"></div>
+
<div class="face back">
+
<h3>焦糖拿铁</h3>
+
</div>
+
</div>
+
 
</div>
 
</div>
 
</body>
 
</body>
 
</html>
 
</html>

Revision as of 13:11, 28 June 2019

Document

DUT_China_B