仅在 elementor 导航菜单中选择文本答案

【问题标题】：select only text in elementor nav menu仅在 elementor 导航菜单中选择文本
【发布时间】：2022-01-02 17:11:03
【问题描述】：

我已经摆弄了几个小时了。

我有一个垂直元素或导航菜单，我想对其应用悬停效果。到目前为止一切顺利，但我似乎只能选择整个列并将影响应用到该列上，而不仅仅是文本的长度。

下面是它当前的外观示例，结束的“括号”在列的末尾始终具有相同的宽度：

我希望它在文本的末尾 - 每个菜单项都不同。

我当前的选择器是 .elementor-7 .elementor-element.elementor-element-1cf0e88 .elementor-nav-menu--main .elementor-item: - 我也尝试使用“a”，这使它无法正常工作全部。

谢谢。

最大

【问题讨论】：

仅通过屏幕截图很难判断，但似乎文本元素具有显示块或 100% 的宽度。尝试仅将文本包装在内联元素中，例如 span。

标签： html css wordpress elementor

【解决方案1】：

您不能只选择文本。文本必须在 html 标记内。

例如：

div {
  color: green;
}

p {
  color: red;
}

span {
  color: blue;
}

<div>
  <p>I am selectable with p {  }</p>
  I am not selectable as I am a text element of root div tag.
  <span>Again I am selectable as I am wrapped with span tag.</span>
<div>

【讨论】：

【解决方案2】：

该网站的链接会有所帮助。

但这里的问题可能是，您定位的元素是“显示：块”或类似元素，制作的是全角元素。

尝试将 a-tag 设置为“display:inline”或“display:inline-block”，这将使宽度适合元素 - 而不是父 div。

或者，您可以将每个链接定位为列表的“第 n 个”元素，但我需要查看实际页面来确定这一点，因为 Elementor 很少只是“Elementor”。您的主题和其他插件也在这里发挥作用。

【讨论】：