<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
</head>
<body>
<div id="maincate" class="maincate">
<a href="#">系列1</a>
<a href="#">系列2</a>
<a href="#">系列3</a>
<a href="#">系列4</a>
<a href="#">系列5</a>
<a href="#">系列6</a>
<a href="#">系列7</a>
<a href="#">系列8</a>
<a href="#">系列9</a>
<a href="#">系列10</a>
</div>
<div>
正文<br>
正文<br>
正文<br>
正文<br>
正文<br>
正文<br>
正文<br>
正文<br>
正文<br>
正文<br>
</div>
<style>
.maincate{width: 100%;
height: 50px;
line-height: 50px;
white-space: nowrap;
box-shadow: 0 1px 2px rgba(0,0,0,.1);
overflow-x: scroll;
overflow-y: hidden;
-webkit-backface-visibility: hidden;
-webkit-perspective: 1000;
-webkit-overflow-scrolling: touch;
text-align: justify;
background: #f78361;
padding: 0px 5px;
box-sizing: border-box;
}
.maincate a{ color: #fff; text-decoration: none; margin-right: 10px;}
.maincate::-webkit-scrollbar{display: none;}
</style>
</body>
</html>