g tag select

[SoYoung210]

Desc

<g> 는 last-child 로 선택이 불가능하다.

왜지 ?

As-is

To-be

How To

billboard.js를 사용중이었다. g tag에 다행히도 class가 있어서 이를 활용했다.

  .bb-axis-y .tick:nth-of-type(2n-1) {
    tspan {
      fill: transparent;
    }
  }

• nth-of-type : 같은 유형의 n번째 형제 요소 nth-child와 nth-of-type의 가장 큰 차이점은 바로 해당하는 태그의 순서를 말하는지 아니면 부모 속성에서 특정 태그를 가진 자식 속성에서 몇번째 해당하는지의 차이

Ref

https://codepen.io/gifteconomist/pen/dNLePJ