: 속성 선택자와 혼합 된 마지막 자식 의사 클래스가 작동하지 않습니다.

특정 data- 속성이있는 요소의 첫 번째 및 마지막 자식을 선택하려고합니다.: 속성 선택자와 혼합 된 마지막 자식 의사 클래스가 작동하지 않습니다.

:first-child 선택기가 제대로 작동하지만 :last-child이 작동하지 않습니다. 나는 심각하게 이것을 일으킬 수있는 것을 모른다. 오타가 있는지 확인했습니다. 나는 특정 data- 속성과 요소의 처음과 마지막 아이를 선택하기 위해 노력하고있어

.element[data-type='element']:first-child { 
    padding-left: 0; 
    background-color:red !important 
} 

.element[data-type='element']:last-child { 
    padding-right: 0; 
    border-right:0; 
    background-color:red !important; 
}

출처

2014-09-19 UserDy

나머지 HTML 구조에 따라 [': first-of-type'] (https://developer.mozilla.org/en-US/docs/Web/CSS/ : first-of-type) 및 [': last-of-type'] (https://developer.mozilla.org/en-US/docs/Web/CSS/:last-of-type)을 참조하십시오. – showdev

** 첫 번째 자식 ** 선택기에'! important' 뒤에 세미콜론을 넣어야합니다. 선택자 (마지막 규칙이므로)에 영향을 미치지는 않지만 다음 규칙에 영향을 미칠 수 있습니다. – worldofjr

행운이 없습니다. 나는 첫 번째와 마지막 아이를 다음과 같이 바꿨다. 첫 번째 유형 : last-of-type하지만 여전히 동일한 문제. 나는 또한 세미콜론을 추가했다. 그러나 그것은 그것을 고칠 didnt한다. – UserDy

CSS.

결론은 CSS에서 할 수있는 방법이 아닙니다.

last-child (및 last-of-type)이 아니라, "마지막 아이"및 "형의 마지막 자식", 의미, 그들은 하지는 의미합니까 "속성 선택을 포함하여 전체 선택 일치하는 마지막 아이". 귀하의 경우, 세 번째 div은 실제로 부모 요소 내의 마지막 자식이 아니거나 마지막 div이 아닐 가능성이 큽니다. 상위 요소와 모든 하위 요소를 포함하여 전체 HTML을 표시하지 않으면 알 수 없습니다.

출처

2014-09-19 02:21:59

: 속성 선택자와 혼합 된 마지막 자식 의사 클래스가 작동하지 않습니다.

답변

관련 문제