老虎机案例
作者：互联网
<html lang="en">
<head>
<meta charset="UTF-8">
<title>老虎机模型</title>
<style>
#div1{
position: relative;
top: 108px;
}
#div2{
position: relative;
top:-216px;
left:324px;
}
#div3{
position: relative;
top:-270px;
}
#div4{
position: relative;
top: -270px;
}
#div5{
position: relative;
top: -1078px;
left: 58px;
}
#l1{
position: relative;
left: 54px;
}
#l2{
position: relative;
top: -54px;
left: 108px;
}
#l3{
position: relative;
top: -108px;
left: 162px;
}
#l4{
position: relative;
top: -162px;
left: 216px;
}
#l5{
position: relative;
top: -216px;
left: 270px;
}
#l6{
position: relative;
top: -540px;
left: 324px;
}
#l7{
position: relative;
top: -594px;
left: 54px;
}
#l8{
position: relative;
top: -648px;
left: 108px;
}
#l9{
position: relative;
top: -702px;
left: 162px;
}
#l10{
position: relative;
top: -756px;
left: 216px;
}
#l11{
position: relative;
top: -810px;
left: 270px;
}
#l12{
position: relative;
top: -866px;
left: 324px;
}
</style>
</head>
<body>
<div id="div1" class="out">
<div><img src="imgs/1.png" height="50" width="50"/></div>
<div><img src="imgs/2.png" height="50" width="50"/></div>
<div><img src="imgs/3.png" height="50" width="50"/></div>
<div><img src="imgs/4.png" height="50" width="50"/></div>
<div><img src="imgs/5.png" height="50" width="50"/></div>
<div><img src="imgs/1.png" height="50" width="50"/></div>
</div>
<div id="div2" class="out">
<div><img src="imgs/1.png" height="50" width="50"/></div>
<div><img src="imgs/5.png" height="50" width="50"/></div>
<div><img src="imgs/4.png" height="50" width="50"/></div>
<div><img src="imgs/3.png" height="50" width="50"/></div>
<div><img src="imgs/2.png" height="50" width="50"/></div>
<div><img src="imgs/1.png" height="50" width="50"/></div>
</div>
<div id="div3" class="out">
<div id="l1"><img src="imgs/1.png" height="50" width="50"/></div>
<div id="l2"><img src="imgs/3.png" height="50" width="50"/></div>
<div id="l3"><img src="imgs/4.png" height="50" width="50"/></div>
<div id="l4"><img src="imgs/3.png" height="50" width="50"/></div>
<div id="l5"><img src="imgs/2.png" height="50" width="50"/></div>
<div id="l6"><img src="imgs/1.png" height="50" width="50"/></div>
</div>
<div id="div4" class="out">
<div id="l7"><img src="imgs/5.png" height="50" width="50"/></div>
<div id="l8"><img src="imgs/2.png" height="50" width="50"/></div>
<div id="l9"><img src="imgs/3.png" height="50" width="50"/></div>
<div id="l10"><img src="imgs/1.png" height="50" width="50"/></div>
<div id="l11"><img src="imgs/5.png" height="50" width="50"/></div>
</div>
<div id="div5" class="out"><img src="imgs/6.png" height="206" width="254"/></div>
</body>
</html>
标签：270px,top,relative,案例,216px,position,老虎机,left 来源： https://blog.csdn.net/haimufff/article/details/112716746