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

最新推荐文章于 2024-04-21 09:10:41 发布

qinyuHTML

最新推荐文章于 2024-04-21 09:10:41 发布

阅读量3.9k

点赞数

分类专栏： HTML5+CSS3，JS，JavaScript

本文链接：https://blog.csdn.net/qinyuhua93/article/details/78016646

版权

HTML5+CSS3，JS，JavaScript 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

使用两个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>

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

qinyuHTML

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
overflow 显示一行可以滑动，不显示滑动滚动条

使用两个div，完成div将内层div的滚动条遮挡住，使用户看不到滚动条body,p{ margin:0;}.citySpan{display: inline-block; text-align: left; padding-left:10px;}.div1{ font-size: 10px; color: #a4a4a4; padding-
复制链接

扫一扫