代码之家 › 专栏 › 技术社区 › James

悬停时目标上一跨距在按钮内[重复]

css

James · 技术社区 · 4 年前

加号( +

上一个兄弟姐妹有没有同等的?

0 回复 | 直到 5 年前

R-D 4 年前

不,没有“上一个同级”选择器。

在一个相关的注释上, ~ 用于一般后继同级(意味着元素在这个元素之后,但不一定紧跟其后),并且是CSS3选择器。 + 用于下一个同级,是CSS2.1。

看到了吗 Adjacent sibling combinator 从 Selectors Level 3 和 5.7 Adjacent sibling selectors Cascading Style Sheets Level 2 Revision 1 (CSS 2.1) Specification .

-1

×××× × ××¢×-×©× 4 年前

我找到了一种方法来设计所有以前的兄弟姐妹(与 ~ )这可能会根据你的需要而起作用。

假设你有一个链接列表,当你将鼠标悬停在一个链接上时,前面的所有链接都会变成红色。你可以这样做:

/* default link color is blue */
.parent a {
  color: blue;
}

/* prev siblings should be red */
.parent:hover a {
  color: red;
}
.parent a:hover,
.parent a:hover ~ a {
  color: blue;
}

<div class="parent">
  <a href="#">link</a>
  <a href="#">link</a>
  <a href="#">link</a>
  <a href="#">link</a>
  <a href="#">link</a>
</div>

推荐文章

YunusoviÄ · 我无法用css更改html段落颜色

1 年前

Blake · 无法使用CSS旋转Angular 15中的字体图标

1 年前

Maarten -Monica for president · 将图像放在锚点标记内时调整网格中的图像大小

1 年前

Phil Lucks · 如何制作边界的外半径?

1 年前

roy_meir · 创建自定义下拉式元素

1 年前

Community wiki · 如何为触摸设备优化网站

1 年前

Paras Chandravanshi · 为什么<ul>没有从其父<p>元素继承?

1 年前

tpetzoldt · 如何在有光泽的情况下抑制图像的抗锯齿?

1 年前

boyenec · 反应如何将css样式应用于我从api respose获得的页面的spcifc部分

1 年前

manofconstsorrow · 点击导航项目关闭汉堡菜单

1 年前