dt 및 관련 dd 요소를 선택하는 CSS 선택기가 있습니까?

정의 목록은 일부 키워드가 하나 이상의 값과 관련된 정보를 마크 업하는 좋은 방법입니다.dt 및 관련 dd 요소를 선택하는 CSS 선택기가 있습니까?

dt와 요소가 하나 이상 같으므로 dd 요소가 있으므로 CSS를 사용하여 이러한 관련 항목을 선택하는 방법이 있습니다.

------- ------- ------- 
| Foo | | Bar | | Baz | 
| foo | | bar | | baz | 
------- ------- -------

내가 테두리를 얻을 DT/일 쌍의 번호를 하나 개의 부동 소수점 왼쪽 말할 방법이 필요합니다 : 나는대로이 DL을 제시 할 경우

<dl> 
    <dt>Foo</dt><dd>foo</dd> 
    <dt>Bar</dt><dd>bar</dd> 
    <dt>Baz</dt><dd>baz</dd> 
</dl>

는 다음과 같은 HTML을 고려 , 기타 등등. 보기의 의미 론적 관점에서 형편이다

<dl> 
    <dt>Foo</dt><dd>foo</dd> 
</dl> 
<dl> 
    <dt>Bar</dt><dd>bar</dd> 
</dl> 
<dl> 
    <dt>Baz</dt><dd>baz</dd> 
</dl>

는, 이러한 항목은 다음과 같습니다

는 지금, 나는이 작업을 수행하는 방법을 알고있는 유일한 방법은 DT/DD 요소의 각 세트에 대해 별도의 DLS를 확인하는 것입니다 하나의리스트의 모든 멤버.

dt/dd 요소 그룹에서 작동 할 수있는 선택기 또는 선택기 조합이 있습니까? 목록 항목과 동일한 정도의 dt 하나 개의 항목으로 모든 관련 dd 요소를 선택합니다 :

는 업데이트 I가/제안하는 찾고 무엇

는 DL이 의사 요소 list-item, 같은 것입니다 way는 first-line 의사 요소로 하나의 문자 그룹을 하나의 단위로 선택할 수 있습니다.

출처

2009-09-15 daotoad

이 knittl의 대답에 응답하는에 충분하다. 의견에 knittl의 답변에 적절하게 응답 할 수있는 여지가 없으며이 응답은 질문에 대한 답변을 다루기 때문에 질문의 일부가 아닙니다. 그래서 나는 대답으로 게시 할 것입니다.

knittl은 내가 찾고있는 것이 불가능하다고 말합니다. 나는 그것이 사실이라고 생각했다. 그러나 나는 다양한 표준을 읽을 때 뭔가를 놓칠 수 있었다.

그러나 제공된 이유는 분명히 잘못되었습니다.

knittl는 주장하십시오 <dt> 수 여러 <dd>의의를 가지고 다른 방법 라운드 때문에

가

아니, 없다.

그는 '아니오'로 멈췄다면 정답이었을 것입니다.

그래서 제안 된 그룹에 불확정 한 수의 요소가 있기 때문에 불가능하다고 주장합니다.

이 클레임은 dl의 하위 인 dt 및 dd 요소 집합에 대한 관련 요소 집합을 생성하는 알고리즘을 제공함으로써 직접적으로 반증 될 수 있습니다. 또한, 문서의 불확정 부분에 대해 작동하는 기존 의사 요소의 반대 예제에 의해 반증 될 수 있습니다.

관련된 dt 및 dd 요소를 그룹화하는 의사 요소를 구현하는 논리는 어렵지 않습니다. 따라서 두 유형의 요소의 수가 서로 관련되지 않습니다. 주어진 DL 요소에 대해

는
all_groups 각각의 하위 요소를 검사라는 dt_dd_group의 모음 dt_dd_group
시작이라고 dt 및 dd 요소를 포함하는 컬렉션 유형을 지정 (비 재귀 적) :
- 요소가 dt 인 경우 :
  - 이 첫 번째 요소이거나 이전 요소는 dt 아닌 경우 :
    - 만들기 새로운 dt_dd_group
    - 새로운 dt_dd_group
    - all_groups에하면 dt_dd_group
  - 다른 요소를 현재 요소에 추가합니다. dt_dd_group
- 그렇지 요소는 DD의 경우 :이 첫 번째 요소 인 경우
  - :
    - 만들기 새로운 dt_dd_group
    - 새로운 dt_dd_groupall_groups-
    - 가에 요소를 추가 추가 dt_dd_group
  - elemen 추가 현재 dt_dd_group
복귀 컬렉션 all_groups

이 알고리즘 t 쉽게 관련 세트로 DL 내의 DT/DD 요소 세트를 분할한다.더 초기 DT 요소가 제공되지하는 준수하지만 병적 인 경우를 포함하여 어떠한 법적 DL에 대해서는 :

<dl><dd>foo</dd><dd>bar</dd><dl>

은 선택이 모드 인해 확정 번호 또는 그룹의 DT 또는 DD 요소 불가능하다고 말을하는 것입니다 false로 표시됩니다. 단락의 첫 번째 줄에있는 글자 수는 불확실하지만, :first-line 의사 요소는 CSS 표준의 일부입니다.

CSS 작업 그룹이이 문제를 고려하지 않았거나 문제를 고려하고 어떤 이유로 현재 표준에 포함시키지 않기 때문에 내가 원하는 선택 모드를 사용할 수 없다고 말하는 것이 합리적입니다.

의미 상으로 관련된 dt 및 dd 태그 그룹에서 작동하는 선택기가 이론적으로 가능하지만 이 구현되지 않았습니다.

출처

2009-09-16 05:19:17 daotoad

이 아마 않는 어떤 선택을 직접 그러나 나는 일반적인 형제 콤비와 함께 ID를 사용하여 생각하지, 트릭을 할 수 있습니다. 코드에 대한 내 대답을 참조하십시오. – JamesBarnett

아니요, <dt>은 복수 <dd>을 가질 수 있으며 그 반대의 경우가 있기 때문에 없습니다.

하지만 어쩌면 :

dt + dd { }

는 경우

출처

2009-09-15 20:44:01 knittl

나는 많은 관계로 하나의 알고, 즉 ... 당신이 원하는 것을 할 것 같다 하나 이상의 dd 요소와 함께 ". 'dt + dd'는 dt와 관련 dd 요소가 모두 하나의 단위로 작동하는 것을 허용하지 않습니다. – daotoad

오히려 대다 관계의 고려 :'

' – knittl

일반적인 형제 조합 자와 함께 ID를 사용하는 것은 어떻습니까?

<html> 
    <head> 
      <style type="text/css"> 
       #id1 ~ DD { color: red; } 
       #id2 ~ DD { color: blue; } 
      </style> 
    </head> 
    <body> 
     <dl> 
     <dt id="id1">term 1</dt> 
      <dd>def 1a</dd> 
      <dd>def 1b</dd> 

     <dt id="id2">term 2</dt> 
      <dd>def 2a</dd> 
      <dd>def 2b</dd> 
     </dl> 
    </body> 
</html>

체크 아웃이 바이올린, 내가 DT의 의미 연관이있다 "고 말했다 왜 http://jsfiddle.net/6qEHQ/

출처

2012-10-18 11:50:56 JamesBarnett

안녕하세요, 답변을 삭제하면 죄송합니다. 외관상으로는 우리는 당신의 편집을 간과했다. 방금이 질문에 마주하여 답을 복원했습니다. – BoltClock

여기에있는 제한은 일반 형제 조합자가 특정 요소를 선택할 때까지 * 선택을 허용하지 않기 때문에 ID로 사용하는 방법이 없기 때문에 나중에 ID로 덮어 쓰지 않고도 사용할 수 있습니다. id2 ~ DD {color : blue; }'규칙. – BoltClock

@BoltClock 고마워, 내 대답을 돌려 주려고. 내가 SF로 잠깐 동안 게시 한 것은 처음이었습니다 – JamesBarnett

dt 및 관련 dd 요소를 선택하는 CSS 선택기가 있습니까?

답변

관련 문제