의미 상 올바른 HTML 확인란

Question

가 나는 다음과 같은 형식으로 표시하고자하는 HTML 체크 박스리스트를 가지고 나열?

의미 상 정확한 확인란에 related question이 표시되어 있지만 제목을 고려하지 않았습니다.

아이디어가 있으십니까?

Answer 1

레이블이 지정된 행과 열? 테이블이 올바른 경우가 거의 확실합니다.

일단 사용자가 선택하고 양식을 제출하면 자신의 선택 사항을 다시 표시한다고 가정 해보십시오. 테이블을 사용하여 수집 된 데이터를 표시하는 것이 옳은 것이므로 테이블을 사용하여 데이터를 수집하는 양식을 표시하는 것이 옳습니다.

Answer 2

테이블이 가장 쉬운 방법이지만, 우리가 알고있는 것처럼 테이블을 데이터에 사용해야합니다.

+---style="width:XXXpx"--------------------------------------------------+ 
|+---style="width:100%"-------------------------------------------------+| 
||            +class=opt++class=opt+|| 
||            | title a || title b ||| 
||            +---------++---------+|| 
|+----------------------------------------------------------------------+| 
|+---style="width:100%"-------------------------------------------------+| 
||+----------------------------------------------++class=opt++class=opt+|| 
||| Option 1          || [x] || [x] ||| 
||+----------------------------------------------++---------++---------+|| 
|+----------------------------------------------------------------------+| 
| //repeat for every option            | 
+------------------------------------------------------------------------+ 

모두는 CSS로 가야한다 :

그래서 내가 사업부 구조를 사용하십시오. (위의 '인라인'폭 정의도)

.opt { 
    float:right; width: 10%; /*probably*/ z-index: 99; 
    /*edit2:*/ position: relative; 
} 

이 경우 작동하는지 확실하지 않습니다.

편집 : 아,이 상자는 "div"s, btw입니다.

Answer 3

확인란이 의미있는 행과 열에 의해 결정되므로 표가 올바른 의미 구조로 사용되는 것이 좋습니다.

1과 0을 어떻게 표시 할 것인가를 생각해보십시오. 테이블에서 할 수 있습니다. 당신이하는 일은 세포를 편집 가능하게 만드는 것뿐입니다.

나는이 게시물을 작성하기 시작했을 때보 다 훨씬 확신하고 있습니다. 테이블이 이에 적합한 구조입니다.

Answer 4

의미 론적으로이 레이아웃은 저에게 테이블처럼 보입니다. 따라서이 레이아웃을 실제로 사용해야하는 경우 테이블로 표시해야합니다. 제목과 옵션에는 체크 박스가 포함 된 셀에 대해 th를 사용하십시오.

그러나 결과 폼은 사용하기가 매우 어려울 것입니다. 각 텍스트의 텍스트는 각 개별 확인란의 레이블로 사용하기에 적합하지 않으므로 사용자는 &을 클릭하여 확인란 자체의 작은 활성 영역을 클릭해야합니다.

나의 제안과 같이, 두 그룹의 옵션을 사용하는 것입니다 :

<fieldset><legend>Title 1</legend> 
    <input type="checkbox" id="t1o1"><label for="t1o1">Option 1</label> 
    <input type="checkbox" id="t1o2"><label for="t1o2">Option 2</label> 
    ... 
</fieldset> 
<fieldset><legend>Title 2</legend> 
    ... 
    <input type="checkbox" id="t3o2"><label for="t2o3">Option 2</label> 
    <input type="checkbox" id="t2o3"><label for="t2o3">Option 3</label> 
</fieldset> 

예,이 어느 정도 유지 보수를 방해 텍스트의 일부를 반복 의미; 그러나, 나는 일종의 유용성이 유지 보수보다 우선해야한다고 생각한다.