2012-03-29 3 views
2

ID에 고정 된 접두어가있는 반복 요소에 스타일을 적용해야합니다. 예 : 생성 된 ID old-price-520의 경우 old-price이 접두어이며 숫자 접미어가 달라집니다.ID 앞에 접두어가 붙은 요소에 스타일을 적용하는 방법은 무엇입니까?

어떻게 이러한 요소에 스타일을 적용합니까? 또는 CSS를 사용하여 스타일을 적용하려면 어떻게해야합니까? 여기

는 내가하고 싶은 것에 대한 그림이다 :

#old-price-* { 
    // some styles 
} 

답변

4
div[id|="old-price"] 

'속성은 선택과 시작' 모두 선택하겠습니다 div (id = old-price-*)

Handycap은 id-selector #의 힘에 비하면 성능이 떨어집니다. 또한 그것은 일반 #보다 낮은 특이성을 가지고 있습니다.

편집 :

fiddle

+0

이것이 최선의 선택입니다. CSS2이고 IE7에서도 작동합니다. – thirtydot

+0

+1, 좋은 것, 나는 이것을 알지 못했습니다. –

+0

@christoph :이 방법은 시도하지 못했습니다. 그러나 작동하지 않습니다. Firefox 11.0을 사용 중입니다. –

-1

당신은이 작업을 수행하기 위해 jQuery를 사용할 수

http://api.jquery.com/attribute-starts-with-selector/

+1

를 지원하지 않는 브라우저에 대한 몇 가지 자바 스크립트를 추가해야합니다 그러나

div[id^=old-price] { // some styling } 

-1이 문제가 아니었다. 모든 것을 위해 jquery 사용을 중지하십시오 ... – Christoph

+0

그는 jQuery를 사용할 수 없다고 구체적으로 말하지 않았습니다.이 질문에 대한 유효한 대답입니다. – Magrangs

+0

jQuery 태그를 보았습니까? jQ에 대해 someting을 작성 했습니까? jQ를 사용하는 코드를 제공 했습니까? – Christoph

2

은 당신이 그렇게 할 수있는과 같이, CSS3의 속성 선택 '로-시작'

[Attr^="value"] 

을하고 구체적인 예는 다음과 같다 것 이 :

*[id^="old-price-"] 

동일한 결과를 얻는 방법이 더 많을 수 있으므로 빠른 검색을 위해 attribute selectors depiction을 빠른 참조로 사용했습니다.

2

이 같은 CSS3 속성 선택기를 사용하려고 할 수 있습니다 : 당신이 그것을

+0

이것은 또한 작동합니다 –

관련 문제