Question

缩小窗口时如何制作水平滚动？我在体内制作了溢出-x，但是没有水平滚动和元素移位 - 我不需要移位。使用图片链接到html和css：https://drive.google.com/drive/folders/0ByQHLazSsLs-dF9TbzJUcWdSVms?usp=sharing

Answer 1

您可能需要将元素包装在div中，然后使用媒体查询。

CSS3的@media查询将改变HTML在特定屏幕尺寸下的行为方式。

＆＃13;

body {
      width:95%;
      height500px;
      background-color: lightgreen;
}
div {
     width: 100px;
     background: lightblue;
  }

@media screen and (max-width: 768px) {
    body {
        background-color: lightgreen;
        
      
    }
  div {
     width: 800px;
     background: lightblue;
     overflow-x:scroll;
  }
}

＆＃13;

<div>
  asdfas
  </div>

＆＃13;

Answer 2

只需设置body代码的宽度并应用overflow-x: scroll;

即可

body{
    overflow-x: scroll;
    width: 1200px;
}

我希望这对你有用。

缩小窗口时如何制作水平滚动？

2 个答案: