표 형식을 사용하지 않고 테이블 형식 데이터 (필드 제목과 데이터)를 의미 적으로 나타냅니다.

Question

의미있는 HTML5 웹 페이지 인 &을 코딩했습니다. 그러나 나는 방금 걸림돌을 쳤다.

일반적으로 HTML 내에서 표 형식의 데이터 (즉, 표제와 해당 데이터)로 표시되지만,이 경우 테이블을 사용할 수 없다. 시각적 디자인/레이아웃 요구 사항

의미 론적으로 말하자면 보조 기술과 함께 테이블 형식을 잘 표현할 수있는 표를 사용하는 HTML 대체 방법이 있습니까? 스크린 리더?

<p> <strong>Heading 1</strong>: <span>Data 1</span> </p> <p> <strong>Heading 2</strong>: <span>Data 2</span> </p>

하지 최적의 솔루션을하지만, 나를 시각 디자인 요구 사항을 충족 할 수 있도록 않습니다 순간

나는 실행하고 있습니다.

감사합니다.

Answer 1

HTML5에는 의미와 표현간에 엄격한 구분이 있습니다. 대부분의 '기본'프리젠 테이션 효과는 바로 브라우저의 기본 스타일 시트에있는 규칙입니다.

데이터가 의미 상으로 테이블 인 경우 반드시 table 요소를 사용하십시오. 기본 테이블 을 렌더링하면 정말는, (나는 실제로 당신이 예를 들어 table-layout 규칙을 달성 할 수있는 주어진 놀랄 것)에 맞게 재정의 부담하지 않습니다

이

table.customtable, table.customtable tr { 
    display:block;   /* overrides the defaults of 'table' and 'table-row' */ 
} 
table.customtable td { 
    display:inline-block; /* overrides the default value of 'table-cell' */ 
} 

이 같은 의미를 유지하지만, 레이아웃이 끝날 때까지 자유롭게 사용할 수 있습니다.