![这里写图片描述](https://img-blog.csdn.net/20160527173213437)
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>AlloyFinger</title>
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<style>
html,
body {
margin: 0;
padding: 0;
border: 0;
background-color: #ccc;
text-align: center;
font: 14px / 1.5 "Helvetica Neue", Helvetica, Arial, "Microsoft Yahei", "Hiragino Sans GB", "Heiti SC", "WenQuanYi Micro Hei", sans-serif;
}
.header {
background-color: #333;
height: 40px;
color: white;
text-align: left;
text-indent: 20px;
font-weight: bold;
font-size: 20px;
line-height: 40px;
}
.title {
height: 30px;
color: #333333;
font-size: 20px;
line-height: 30px;
}
.example img {
width: 160px;
}
.imgBox {
margin-bottom: 10px;
border-bottom: 1px solid #333333;
}
.swipeBox {
height: 160px;
width: 160px;
margin: 0 auto;
overflow: hidden;
font-size: 0;
position: relative;
border: 2px solid #ccc;
box-sizing: border-box;
}
.scroll {
width: 480px;
height: 160px;
white-space: nowrap;
}
.nuclear-nav {
position: absolute;
bottom: 6px;
right: 10px;
}
.nuclear-nav a {
display: inline-block;
background-color: white;
cursor: pointer;
width: 10px;
height