특정 클래스 요소를 포함하는 마지막 요소에 대한 스타일 피하기

댕글 링 크루즈

나는 다음과 같은 계층 구조를 가지고 있으며 여러 곳에서 사용됩니다 (jQuery를 통해 클래스를 추가하는 것은 불가능합니다).

<li class="paginable">
    <span id="step-1" class="done"></span>
</li>

<li class="paginable">
    <span id="step-2" class="done"></span>
</li>

<li class="paginable">
    <span id="step-3" class="done"></span>
</li>

<li class="paginable">
    <span id="step-4" class="not-done"></span>
</li>

<li class="paginable">
    <span id="step-5" class="not-done"></span>
</li>

클래스의 기초 done요소에 span, 나는 그에게 어떤 스타일을 제공해야 span[id^="step-"]또한 클래스를 가지고하는 done.

그러나 span클래스에 마지막 포함하지 않습니다 done.

span클래스로 마지막 제외하려면 어떻게해야합니까 done? 일련의 단계처럼 순서대로 클래스 donenot-dont변경됩니다.

난 노력 했어: span[id^="step-"].done:not(-- with lots of combinations of last child on parent as well as child --)

그러나 그것은 작동하지 않으며 논리적으로 그 이유를 알고 있습니다.

CSS 만 제안 하시겠습니까? 아니면 jQuery를 사용하여 전환되는 모든 곳에서 클래스를 추가해야합니까?

아룬 P 조니

CSS 전용 솔루션을 사용할 수 있다고 생각하지 않습니다.

jQuery 사용

$('span.done[id^="step-"]').not(':last').css('color', 'red')

데모 : Fiddle

이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.

침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제

에서 수정
0

몇 마디 만하겠습니다

0리뷰
로그인참여 후 검토

관련 기사

분류에서Dev

특정 텍스트가있는 요소를 포함하는 특정 클래스가있는 요소에 대한 CSS / Xpath 선택기

분류에서Dev

특정 클래스가있는 마지막 요소를 제외한 모든 요소 선택

분류에서Dev

특정 스타일을 가진 모든 요소에 대해 CSS 클래스를 추가하는 방법

분류에서Dev

jQuery : 요소에서 마지막 클래스를 제외한 모든 클래스를 제거하는 방법

분류에서Dev

JQuery 선택기에 대한 클래스의 모든 요소가 아닌 클래스의 일부인 특정 HTML 요소를 선택하는 방법

분류에서Dev

특정 클래스가있는 마지막 요소 선택

분류에서Dev

jquery css 선택기는 ID가있는 요소와 일치하는 마지막 점 뒤에 특정 텍스트를 포함합니다.

분류에서Dev

스타일이 지정된 구성 요소의 마지막 요소를 선택하지 않는 방법

분류에서Dev

요소에 부모 컨테이너가 없을 때 특정 CSS 클래스로 마지막 요소를 선택하는 방법이 있습니까?

분류에서Dev

CSS는 같은 클래스 이름을 가진 다른 요소의 자식 인 클래스에 대한 스타일을 지정하는 방법

분류에서Dev

웹 구성 요소에서 마지막 슬롯 요소의 스타일을 지정하는 방법

분류에서Dev

CSS-특정 스타일 사양에 여러 개의 작은 클래스를 사용하거나 일반적으로 사용되는 요소에 대해 완전한 스타일을 가진 단일 클래스 사용에 대한 의견

분류에서Dev

CSS는 특정 클래스 만 포함하는 요소를 선택합니다.

분류에서Dev

jQuery를 사용하여 동일한 클래스 내에서 하나의 요소 만 대상으로 지정

분류에서Dev

if 문에 해당하지만 다른 요소와 동일한 클래스를 갖는 특정 항목에 클래스 추가

분류에서Dev

jQuery : 하위 요소의 클래스에 대한 클릭 방지 : tr에서 페이지 리디렉션 특정 td를 제외하고 클릭

분류에서Dev

두 클래스로 요소를 선택하고 해당 특정 요소에 대해서만 CSS 속성 변경

분류에서Dev

두 클래스로 요소를 선택하고 해당 특정 요소에 대해서만 CSS 속성 변경

분류에서Dev

SCSS의 요소에 대한 "수정 된"클래스를 추가하는 방법

분류에서Dev

이미지 요소에 대한 DataTriger 스타일 설정 기

분류에서Dev

특정 클래스가있는 페이지의 마지막 요소 선택

분류에서Dev

각 하위에 대한 선택기 목록을 작성하지 않고 특정 클래스가있는 특정 요소의 모든 하위 요소를 선택할 수 있습니까?

분류에서Dev

다중 클래스 요소의 특정 클래스 요소에 대한 Dom 노드 인덱스 찾기

분류에서Dev

마지막 4 개를 제외한 모든 요소의 스타일 지정

분류에서Dev

모든 것이 동일한 클래스를 가질 때 웹 페이지의 마지막 요소에 액세스하는 방법은 무엇입니까?

분류에서Dev

document.elementFromPoint를 사용하여 특정 좌표의 요소에 특정 클래스가 있는지 확인

분류에서Dev

요소에 대한 클래스를 업데이트하지 않음-jQuery

분류에서Dev

jQuery를 사용하여 마지막 요소 (클래스 별)를 제외한 모든 요소를 숨기는 방법

분류에서Dev

요소에 특정 CSS 속성이 포함 된 경우 클래스를 추가하는 방법

Related 관련 기사

  1. 1

    특정 텍스트가있는 요소를 포함하는 특정 클래스가있는 요소에 대한 CSS / Xpath 선택기

  2. 2

    특정 클래스가있는 마지막 요소를 제외한 모든 요소 선택

  3. 3

    특정 스타일을 가진 모든 요소에 대해 CSS 클래스를 추가하는 방법

  4. 4

    jQuery : 요소에서 마지막 클래스를 제외한 모든 클래스를 제거하는 방법

  5. 5

    JQuery 선택기에 대한 클래스의 모든 요소가 아닌 클래스의 일부인 특정 HTML 요소를 선택하는 방법

  6. 6

    특정 클래스가있는 마지막 요소 선택

  7. 7

    jquery css 선택기는 ID가있는 요소와 일치하는 마지막 점 뒤에 특정 텍스트를 포함합니다.

  8. 8

    스타일이 지정된 구성 요소의 마지막 요소를 선택하지 않는 방법

  9. 9

    요소에 부모 컨테이너가 없을 때 특정 CSS 클래스로 마지막 요소를 선택하는 방법이 있습니까?

  10. 10

    CSS는 같은 클래스 이름을 가진 다른 요소의 자식 인 클래스에 대한 스타일을 지정하는 방법

  11. 11

    웹 구성 요소에서 마지막 슬롯 요소의 스타일을 지정하는 방법

  12. 12

    CSS-특정 스타일 사양에 여러 개의 작은 클래스를 사용하거나 일반적으로 사용되는 요소에 대해 완전한 스타일을 가진 단일 클래스 사용에 대한 의견

  13. 13

    CSS는 특정 클래스 만 포함하는 요소를 선택합니다.

  14. 14

    jQuery를 사용하여 동일한 클래스 내에서 하나의 요소 만 대상으로 지정

  15. 15

    if 문에 해당하지만 다른 요소와 동일한 클래스를 갖는 특정 항목에 클래스 추가

  16. 16

    jQuery : 하위 요소의 클래스에 대한 클릭 방지 : tr에서 페이지 리디렉션 특정 td를 제외하고 클릭

  17. 17

    두 클래스로 요소를 선택하고 해당 특정 요소에 대해서만 CSS 속성 변경

  18. 18

    두 클래스로 요소를 선택하고 해당 특정 요소에 대해서만 CSS 속성 변경

  19. 19

    SCSS의 요소에 대한 "수정 된"클래스를 추가하는 방법

  20. 20

    이미지 요소에 대한 DataTriger 스타일 설정 기

  21. 21

    특정 클래스가있는 페이지의 마지막 요소 선택

  22. 22

    각 하위에 대한 선택기 목록을 작성하지 않고 특정 클래스가있는 특정 요소의 모든 하위 요소를 선택할 수 있습니까?

  23. 23

    다중 클래스 요소의 특정 클래스 요소에 대한 Dom 노드 인덱스 찾기

  24. 24

    마지막 4 개를 제외한 모든 요소의 스타일 지정

  25. 25

    모든 것이 동일한 클래스를 가질 때 웹 페이지의 마지막 요소에 액세스하는 방법은 무엇입니까?

  26. 26

    document.elementFromPoint를 사용하여 특정 좌표의 요소에 특정 클래스가 있는지 확인

  27. 27

    요소에 대한 클래스를 업데이트하지 않음-jQuery

  28. 28

    jQuery를 사용하여 마지막 요소 (클래스 별)를 제외한 모든 요소를 숨기는 방법

  29. 29

    요소에 특정 CSS 속성이 포함 된 경우 클래스를 추가하는 방법

뜨겁다태그

보관