-2

请帮助我在 CSS(没有 JS)中解决这些问题。我正在学习,无法找到一些导航问题的答案。请不要怪我:)

我为网站创建了导航和第一个屏幕,但遇到了这些问题。这是所有内容的屏幕截图:https ://prnt.sc/ln3ytx 和我在 Codepen 上的笔:https://codepen.io/a007mr/pen/mQKyYM

  1. 如何使所有行的背景悬停?我的代码是.menu-item ul a:hover {color: #000000; background: #d2d4d6; ,但它不起作用。如何使它像这样:https ://prnt.sc/ln3mvm

  2. 当我打开下拉菜单时,部分导航正在向右跳转。如何避免这种跳跃?

  3. 如何在任何桌面尺寸的角落制作导航按钮?我正在使用 margin: 15px; ,但是当我要提高屏幕分辨率时它不能很好地工作。它没有响应。如果我选择较大的桌面,该按钮将不在右上角。

  4. 所有导航都存在同样的问题。如何为任何桌面尺寸在一个地方定位导航?

  5. 如何通过单击(而不是悬停)打开下拉菜单并仅通过单击隐藏下拉菜单?我的代码li:hover > ul。如果我改变,li:active > ul那么只有当我按住按钮时才会出现下拉菜单。如何制作 *click 按钮 -> 我们显示下拉菜单并可以选择某些内容 -> *other 点击“了解更多”并隐藏菜单。

  6. 如何在主按钮下方设置边距?:) 我写了margin-top: 20px;,但它不起作用。

  7. 如何让所有导航的背景都没有边距?

怎么了?我该如何解决?请帮忙。

4

1 回答 1

-1

我会尽力给你一些答复:

如何使所有行的背景悬停?我的代码是 .menu-item ul a:hover {color: #000000; 背景:#d2d4d6;但它也不起作用。如何使它像这样:https ://prnt.sc/ln3mvm

1) Try uses block elements. Remember that css property 
 display: block; makes your element a block element.

当我打开下拉菜单时,部分导航正在向右跳转。如何避免这种跳跃?

2) Your items in the list must be made as blocks and it item (li>a) need to be 
increased.

常见示例: https://codepen.io/bear-wolf/pen/YRvoWO?editors=1100#0

于 2018-11-26T12:53:18.070 回答