1
순수한 CSS에 의해 의 내부에있는 유사 요소에 요소 z-index
의 값을 표시하려고합니다.css 변수 유형을 변환하는 방법은 무엇입니까?
나는 CSS 변수를 사용하기로 결정했습니다. 그러나 문제는 z-index
은 숫자이지만 content
은 문자열입니다. 가치를 어떻게 내포 할 수 있습니까?
예 : p
이 z-index: var(--z)
인 경우 div
은 z-index: 8
입니다. p
에 z-index
을 사용하고 after
을 동시에 표시하고 싶습니다. 내가 어떻게 해?
p {
position: relative;
z-index: var(--z);
background: silver;
}
p:after {
content: var(--z);
color: red;
}
div {
background: red;
z-index: 8;
}
/* just some styling and positioning stuff bellow */
body {
margin: 0;
}
p {
margin: 1em .5em;
padding: 0 .5em 0 3.5em;
line-height: 2em;
}
div {
position: absolute;
top: .5em;
left: 1em;
height: 6em;
width: 2em;
}
<p style="--z: 9">
I have correct z-index, but have no :after
</p>
<p style="--z: '9'">
I have no z-index, but have :after
</p>
<div></div>
PS : Same question in Russian.