移动响应式显示

Mobile Responsive Displays

本文关键字：显示 响应 移动      更新时间：2023-09-26

我正在设计一个移动响应的网站。我正在使用一段独特的代码，允许我打开多个隐藏的ul，但它们都向左滚动。

问题是在台式机或笔记本电脑上，它显示滚动条，因此，如果你是新的网站，你会知道它滚动。但是在移动网站上，它不显示这个滚动条，因此，如果你是移动端网站的新手，你不知道这些项目滚动。

我想知道是否有一种方法来隐藏内容，直到它得到800px的宽度，它会显示文本，告诉人们滚动到左边。或者，即使有一种方法可以给滚动条提供可见的左右按钮，当点击或粘贴在台式机、笔记本电脑和移动设备上时，也可以向左或向右滚动。

如有任何建议，不胜感激。

谢谢

您可以使用css @media标签调整响应值。例如，您正在使用像这样的普通css类:

.YourClass{
    display:block;
 }

对于max-width:800px的移动宽度，您可以使用它来进行响应性调整:

 @media only screen and (max-width: 800px){
   .YourClass{
       display:none;
    }
 }

在这个例子中，如果窗口宽度小于800px，浏览器使用在@media only screen and (max-width: 800px)中放置的类并隐藏内容。如果它大于800px，它使用你的普通css类并显示内容。

你可以在这个链接找到用法和各种例子。

相关文章：