overflow 显示一行可以滑动,不显示滑动滚动条

使用两个div,完成div将内层div的滚动条遮挡住,使用户看不到滚动条
<html>
<head>
<style type="text/css">
body,p{
  margin:0;
}
.citySpan{
display: inline-block;
    text-align: left;
    padding-left:10px;
}
.div1{
  font-size: 10px;
    color: #a4a4a4;
    padding-left: 2%;
    width: 100%; 
    white-space: nowrap;
    text-overflow: ellipsis; 
    overflow: hidden; 
    height: 30px;
}
</style>
</head>

<body>
<div class="div1">
  <div style="overflow-x: auto; height: 50px;">
    <p>
      <span class="citySpan">安阳东--阿拉山口</span>
      <span class="citySpan">石家庄--阿拉山口</span>
      <span class="citySpan">武汉--天津</span>
      <span class="citySpan">合肥--广州</span>
      <span class="citySpan">上海--合肥</span>
    </p>
  </div>
</div>
</body>

</html>

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章