仅限水平滚动!

2024-01-27

我有一个包含水平菜单的菜单。菜单由无序列表组成。 我希望每当菜单超出宽度时 div 都会获得水平滚动条<div>。 我尝试使用这些 CSS 定义<div>:

position: absolute;
width: 380px;   
overflow: auto;
overflow-y: hidden;
height: 30px;

但后来意识到,由于菜单是列表,不同的列表项只要达到菜单的宽度就会断线。<div>并移至下一行,因此浏览器不会认为需要水平滚动条(它也不会显示垂直滚动条,因为overflow-y: hidden; line)

我有什么想法可以创建一个仅水平滚动的 1 行水平菜单吗?

非常感谢大家。


您也许可以使用空白属性来防止换行。如果没有更多代码,很难知道它是否适用于您的情况。

对于你的 div,尝试:

white-space: nowrap;
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

仅限水平滚动! 的相关文章

  • 通过 JavaScript 检测浏览器换行

    我需要 javascript 来检测每个浏览器包装的文本行并将其包装到 span class line 我读过一些关于测量每个单词的 y 轴的文章 但还没有看到可靠的解决方案 这是我到目前为止所拥有的 看到它Jsfiddle http js
  • html 和 body 元素的高度

    我一直在互联网上查找 min height 和 height 属性如何在 body 和 html 元素上工作 我在很多地方都看到过下面的代码 html height 100 body min height 100 上面的内容可以与其他一些
  • CSS 的波浪形状

    我正在尝试使用 CSS 重新创建此图像 我不需要重复它 这就是我开始的 但它只有一条直线 wave position absolute height 70px width 600px background e0efe3 div div 我认
  • 使用 实现可访问性的更好做法是什么?

    我有一个下载链接 但我找不到任何良好的可访问解决方案来说明如何处理这种情况 我遵循一个共同的经验法则 按钮做事 链接去地方 我的情况是 我有一个触发文档下载的按钮 同一页面 我相信这应该是一个具有按钮角色的锚点 因为它明确不触发重定向或导航
  • 如何在同一页面上使用AJAX处理多个表单

    我有一个表单 当我单击 提交 时 它就被提交了 然后该表单隐藏 操作页面的结果显示在 div 中 classname dig 它工作正常 但是当我添加另一个表单时 它停止正常工作并且所有表单同时提交 我如何更改我的代码 done click
  • 垂直对齐复选框标签? [复制]

    这个问题在这里已经有答案了 我有这样的复选框
  • 每 3 秒重复一次动画

    我正在使用 WOW js 和 animate css 现在我正在将 CSS 运行到 Infinite 我想知道如何让我的课程运行 3 秒停止并再次开始到无限 My html img src images fork png class for
  • 禁用引导列上的滚动

    我正在尝试禁用引导列上的滚动 这是我的代码 div class container fluid h 100 div class row h 100 div class col 4 h 100 bg dark fixed div div cl
  • 如何重置使用 JavaScript 更改的 CSS 属性?

    我的导航按钮的宽度从 100px 增加到 150px 当鼠标悬停在 nav li hover width 150px 但是使用 javascript 我已经做到了 无论选择哪个选项 宽度都将继续为 150px 当选择每个选项时 它会使其他选
  • 如何指定网站的语言? (HTML?)

    如何指定页面采用某种语言以便搜索引擎可以理解 这是我放在顶部的元标记吗 如果是 您知道大多数搜索引擎是否使用它来确定语言吗 我已将一页英文内容转换为几种不同的语言 并希望将该信息包含在 html 中 让搜索引擎知道他们正在处理哪种语言 快速
  • 如何设置菜单按钮和菜单项的样式

    我尝试更改菜单按钮中的样式 我可以更改菜单按钮样式 但不能更改其菜单项 无论我尝试什么 菜单按钮内的菜单项都保持不变 menu button fx background color black menu button label fx ba
  • 如何防止 Iframe 在与浏览器交互后弄乱浏览器的历史记录?

    因此 就我而言 我使用 Iframe 将 Grafana 附加到我的页面 这为我提供了漂亮且易于使用的图表 可以注意到 每次在图表上进行放大或缩小 使用鼠标单击 交互后 Grafana 的 Iframe 都会在我的 Angular 页面上触
  • 如何将 Google Charts 与 Vue.js 库一起使用?

    我正在尝试使用 Vue js 库使用 Google Charts 制作图表 但我不知道如何添加到 div 这是我尝试做的 这是如何使用普通 javascript 添加图表 这是文档的代码示例 https developers google
  • MVC 在布局代码之前执行视图代码并破坏我的脚本顺序

    我正在尝试将所有 javascript 包含内容移至页面底部 我正在将 MVC 与 Razor 一起使用 我编写了一个辅助方法来注册脚本 它按注册顺序保留脚本 并排除重复的内容 Html RegisterScript scripts som
  • jquery从变量中删除html元素

    我将 html 保存在变量中 var itinerary events today html 我有很多 html 和一个按钮我想删除 它的 ID 为 myButton 如何从变量中保存的 html 中删除它 我建议这种方法 var itin
  • HTML 中部分着色的阿拉伯语单词

    我不会说阿拉伯语 但我需要我们网站上对阿拉伯语的具体支持 我需要将部分阿拉伯语单词放在 span 与单词其他部分的风格不同 当我输入两个字符时 and 它们被组合成word 但是当我使用 HTML 标记时 span span 这些字母在输出
  • 如何在没有@import的情况下减少@import?

    我用的较少 从 Google PageSpeed 我了解到 使用 importCSS 文件中的内容会影响网站速度 所以我想排除任何 import来自我的 CSS 的东西 我有 2 个不同的样式表reset css and rebuild c
  • 我可以使用 jQuery 打开下拉列表吗

    对于 HTML 中的下拉列表
  • 指针事件:无,过滤,适用于 ie8 和任何地方,不适用于 ie9

    正如我在这里看到的 https stackoverflow com questions 3680429 click through a div to underlying elements 4839672 4839672 过滤器可用于模拟跨
  • FireFox 中的“contenteditable = true”高度问题

    当有空的时候div with contenteditable true CSS contenteditable true border 1px dashed dedede padding 3px HTML div div 在 IE 和 Ch

随机推荐

  • AngularJS 未检测到 Access-Control-Allow-Origin 标头?

    我正在本地虚拟主机上运行一个角度应用程序 http foo app 8000 http foo app 8000 它正在向另一个本地 VirtualHost 发出请求 http bar app 8000 http bar app 8000
  • iisreset 后应用程序池未启动

    在开始之前 我知道使用 iisreset 被认为是不好的做法 但无论如何都不应该发生这种情况 我们有什么 多台在 Windows Server 2003 R2 64 和 32 位 上安装 IIS6 的计算机 多个 WCF Web 服务 NE
  • iOS 10 中使用自动调整单元格大小的 collectionViewContentSize

    在 iOS 10 之前 我有一个自调整大小的表视图 它仅由 UICollectionView 和使用标准 UICollectionViewFlowLayout 的自调整大小单元格组成 集合视图单元格的大小使用自动布局来调整 为了使表格单元格
  • HTML 下拉菜单自动宽度调整

    我创建了一个下拉菜单 该下拉菜单存在根据所选内容调整大小的问题 我使用以下 stackoverflow 答案作为调整下拉列表大小的灵感 https stackoverflow com a 20091985 3166468 https sta
  • cordova 无法看到 Android 目标

    我尝试为 Android 平台设置 Ionic Cordova 我安装了 JDK Android SDK 等 但正在运行cordova requirements给我 Requirements check results for androi
  • 在拖动时选择编辑文本中的一些文本

    我想在编辑文本中选择一些文本 但我不知道该怎么做 我需要这样的方法 当用户触摸屏幕然后拖动并离开屏幕时 拖动的文本将被选择 我的英语很差 所以不要介意 谢谢 textView EditText findViewById R id textv
  • PHP,从日期获取明天的日期

    我有一个 PHP 日期 格式为2013 01 22我想以相同的格式获取明天的日期 例如2013 01 23 这怎么可能用 PHP 实现呢 Use DateTime http php net manual en book datetime p
  • .Net毛伊岛如何连接

    对不起 我的英语不好 如何将 SQL Server 与 Net Maui 连接 我在网上尝试了很多方法 但都失败了 我尝试导入 Ado net 但显示错误 错误显示 该项目的目标框架不包含实体框架运行时汇编 首先 您应该配置应用程序常量 配
  • 从 CDN 包中删除 Babel(StandAlone) 警告消息

    我们在项目的某些部分使用 React JS CDN 出于质量目的 我们希望向客户提供无警告的代码 我们正在使用以下库 问题是我们在控制台中收到以下警告消息 您
  • 现在还值得学习微软基础课程(MFC)吗? [关闭]

    Closed 这个问题是基于意见的 help closed questions 目前不接受答案 我是微软技术的忠实粉丝 学习了很多 NET Framework 和 C 之类的编程语言 但我相信 NET 应用程序是在 NET Framewor
  • 调整 NSMutableAttributedString 的字体大小与 UILabel 的框架高度成比例

    在我的项目中 我使用迅捷3 0 现在我正在使用以下课程 UILabel 子类 根据 UILabel 框架高度调整字体大小 当 UILabel 框架发生更改时 layoutSubviews 会重新计算比例字体大小 class Label UI
  • 如何查看AWS ELB后面运行的SSH服务器的SSH客户端的真实IP

    我们在 AWS classic ELB 后面运行两个 gitlab 实例 为了启用 git SSH 推送并通过 git 负载平衡 SSH 请求 我们在 AWS ELB 中添加了 SSH TCP 端口侦听器 在 SSH 日志中 我们看到 EL
  • 创建热图时出错 - 外部函数调用中的 NA/NaN/Inf (arg 11)

    我正在尝试为我的数据准备热图 但我不知道为什么会出现此错误 My data gt dput head tbl ready structure c 0 0 0 0 0 0 0 0 0 0 0 0 0 0 370330677123077 0 0
  • Firebase Cloud Messaging (FCM) 如何切换 Apple 推送通知服务 (APN) 的环境?

    在 Apple 推送通知服务 APN 中 服务器端开发人员必须选择环境类型 沙箱或生产 作为 HTTP 2 URL api sandbox push apple com 或 api push apple com 1 https develo
  • jquery fullcalendar 事件过滤

    有没有什么方法可以在全日历中动态过滤客户端事件 当我从服务器 json encoded 获取事件时 我将自己的参数 school id 分配给每个事件 fullcalendar 准备好后 我想用 select 动态过滤事件 我在页面上添加
  • 升级 SonarQube 问题

    我在安装实例时遇到问题SonarQube4 4至5 1 The 指示 http docs sonarqube org display SONAR Upgrading比如说停止 SonarQube 服务器 匹配几个文件 备份数据库 复制插件等
  • React Hooks:在 Socket.io 处理程序内部调用时状态未更新

    const questionIndex setQuestionIndex useState 0 socket on next gt console log hey setQuestionIndex questionIndex 1 useEf
  • 使用 ptrace 解析 Call 和 Ret。

    我尝试使用 ptrace 解析可执行文件中的所有 Calls 和 Rets 符合x64操作码 http ref x86asm net coder64 html 我找到了操作码呼叫 0xe8并为重试 0xc3 0xc2 0xca 0xcb 自
  • Slurm 多处理 Python 作业

    我有一个 4 节点 Slurm 集群 每个节点有 6 个核心 我想提交一个利用多重处理的测试 Python 脚本 它会生成打印正在运行的节点的主机名的进程 如下所示 def print something print gethostname
  • 仅限水平滚动!

    我有一个包含水平菜单的菜单 菜单由无序列表组成 我希望每当菜单超出宽度时 div 都会获得水平滚动条 div 我尝试使用这些 CSS 定义 div position absolute width 380px overflow auto ov