css - WordPress菜单的响应式设计

标签 css responsive-design

我正在开发 WordPress 21 主题的子主题。现场演示可见here .由于 WordPress 已经有响应式支持,我也在做我的主题以响应我正在定制我的主题 CSS。对于某些部分,我已经完成了。在我的菜单部分,我遇到了一些问题。我有两种类型的菜单。一个没有下拉菜单,另一个有下拉菜单。现在我在菜单中遇到了响应式下拉菜单的问题。那么有人可以在这里帮助我吗?

最佳答案

这似乎更像是一个设计问题,而不是技术问题。我建议 1) 将下拉菜单变成 Accordion 菜单(例如 tiny accordion ),或 2) 扩展下拉菜单区域并增加其 z-index,以便您只能将鼠标悬停在下拉菜单上而不激活出现在它下面的任何东西。对于您的设计,这可能意味着增加 z-index 并在下拉菜单的子项上使用类似 margin-top: -2px; 的东西。

然而,响应式设计的理念是让它适用于小型设备,例如智能手机。由于使用触摸的智能手机没有悬停状态,您最好使用上面的建议 1,用户点击初始菜单,然后显示其子菜单。

关于css - WordPress菜单的响应式设计,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13953730/

相关文章:

html - 3 列响应式 CSS(排序内容位置)

html - 读取 : Line up object outside a table with column inside a table

css - 知道为什么这些 DIV 重叠吗?

javascript - 模式打开时禁用触摸滚动

javascript - 响应式导航菜单 Toggle'n

html - 带有响应式下拉菜单的内联菜单

h1标签前后的css背景图片

css - 线性渐变背景问题

javascript - onclick如何将输入值一帧显示到另一帧?

html - 在响应式图像的 <img> 元素上设置宽度和高度属性