给定以下HTML
<div id="field-filter-TIPO" class="css-1hqm095 container">
<svg
aria-hidden="true"
role="img"
class="octicon octicon-x-circle-fill css-djuh4e"
viewBox="0 0 12 12"
width="12"
height="12"
fill="currentColor"
style="
display: inline-block;
user-select: none;
vertical-align: text-bottom;
overflow: visible;
"
>
<path
fill-rule="evenodd"
d="M1.757 10.243a6 6 0 118.486-8.486 6 6 0 01-8.486 8.486zM6 4.763l-2-2L2.763 4l2 2-2 2L4 9.237l2-2 2 2L9.237 8l-2-2 2-2L8 2.763l-2 2z"
></path>
</svg>
<div style="font-size: 16px; width: auto" class="css-1bmhiq9">
<svg viewBox="25 25 50 50" width="1em" height="1em" class="css-1bez47e">
<circle
cx="50"
cy="50"
r="22"
fill="none"
stroke="currentColor"
stroke-width="6"
stroke-miterlimit="10"
class="css-frwtbx"
></circle>
</svg>
</div>
<div
title="ColumnFilter"
kind="ColumnFilter"
id="columnfilter--fetching"
name="Fetching"
class="css-utvy5"
>
<button class="css-m8wrzs">
<svg
stroke="currentColor"
fill="currentColor"
stroke-width="0"
viewBox="0 0 24 24"
font-size="16"
class="css-1cx02qk"
height="1em"
width="1em"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M21 3H5a1 1 0 0 0-1 1v2.59c0 .523.213 1.037.583 1.407L10 13.414V21a1.001 1.001 0 0 0 1.447.895l4-2c.339-.17.553-.516.553-.895v-5.586l5.417-5.417c.37-.37.583-.884.583-1.407V4a1 1 0 0 0-1-1zm-6.707 9.293A.996.996 0 0 0 14 13v5.382l-2 1V13a.996.996 0 0 0-.293-.707L6 6.59V5h14.001l.002 1.583-5.71 5.71z"
></path>
</svg>
</button>
</div>
</div>
为什么这个选择器
.container div > svg {
margin-right: -8px;
}
是否影响第一个svg
(X图标)?
选择器不应该选择在带有svg
类的元素中其父为div
的所有.container
吗?我的目标是创建一个选择器来应用于X图标( svg )和第二个svg(圆形图标)。
发布于 2022-10-18 02:32:36
选择器不应该选择带有.container类的元素中父级为div的所有svg吗?我的目标是创建一个选择器来应用于X图标( svg )和第二个svg(圆形图标)。
第一个svg不在div里面..。在一个容器里。尝试添加ina并检查
发布于 2022-10-18 02:19:45
目前,CSS中没有父选择器(唯一的子选择器)。但是,您可以使用JS属性.parentNode
。
https://stackoverflow.com/questions/74109251
复制