<div> 요소를 대신 <table>?

Question

중복의:

• 왜 사용을 위한 테이블 레이아웃에서는 HTML?
• DIV 의 대 테이블 또는 CSS 대는 바보

---

도 많은 이야기들이 최근 약보를 사용하여 div 보 태그를 당신의 페이지 이상의 브라우저 싶.왜 div 더 나은?

Answer 1

몇 가지 이유 :

1) DIV는 대부분의 경우 의미 적으로 정확합니다. 테이블 구조로 사이트를 코딩하는 사람들은 자신이 만든 것에 대한 테이블을 사용하지 않으며 이는 테이블 데이터입니다. DIV는 "Division"또는 페이지의 섹션을 나타내므로 DIV에 항목을 넣는 것이 더 정확합니다.

2) DIV는 더 유연하고 스타일링하고 유지하기 쉽습니다. 글을 쓸 필요가 없습니다 <table><tr><td>Text here</td></tr></table> 글을 쓸 수있을 때 무언가를 말하고 싶을 때마다 <div>Text here</div> 대신에. CSS 후크 (즉, 클래스 또는 요소)를 테이블과 div 모두에 추가 할 수 있지만 DIV는 무한히 유연합니다.

3) 테이블 구조화 된 사이트는 평범한 못 생겼다 :)

Answer 2

여기서 중요한 점은 그들을 사용한 레이아웃이 있습니다.거기에 아무것도 잘못된 테이블과 테이블 형식 데이터, 습니다,당신을 마음.는 것들이다.

그러나 사용하는 경우에 레이아웃 테이블을 만들이 매우 엄격한 페이지 구조를 하지 않는 일반적으로 플레이로 잘 다른 화면 크기,사용자 에이전트(생각 모바일 브라우저 또는 스크린에 대한 독자니다.특히 후자의 경우에 당신을 파괴하고 어떤 순서 콘텐츠를 읽어야 한 사용자에게).불행하게도 테이블이 아직도 하나의 가장 강력한 메커니즘을 배치 페이지가 있기 때문에,거의 다른 구현 및 그들은 작업에 대한 십 년에 걸쳐 완벽하게—CSS 은 완전히 다른 문제 여기에.

그러나 기본적으로 그것이 내린이:

테이블

• 에 위배 구분의 컨텐츠 및 프레젠테이션
• 는 다루기 힘드와 unmaintainable 에,특히려고 할 때 레이아웃을 변경하는 여러 개의 페이지에 유사한 방식으로
• 이 강하지 않은 의미하는 것이 중요한 장애인을 수 있습니다 사람들에 의존하는 소리내어 읽기 텍스트입니다.테이블은 여기에서 읽을 줄여 열에 의해 열이있는 거의 항상 매우 도움이 되지 않습 테이블 기반의 레이아웃

CSS 레이아웃

• 을 오른쪽으로(적어도에 대한 프레젠테이션)
• 을 허용한다(때로는)분리하는 콘텐츠와 프리젠 테이션입니다.참고 때때로 당신은 종종 사용하는 여러 개의 컨테이너 요소에 HTML 을 허용하기 위해 일부 레이아웃 및 스타일을 작업하기 때문에 권리 CSS 몇 가지 제한 사항이
• 할 수 있습에 대한 더 나은 의미의 기본 태그 iff 지 않을 맹목적으로 사용 <div> 고 <span>.많은 태그가 있는 의미로 사용해야 합니다.예를 들어,사용하지 않는 <div class="heading1"> 할 때 사용할 수 <h1>.

Answer 3

테이블은 의미 론적 의미를 전달하기 때문에 현재 H1과 같은 표 형 데이터를 표시하고 있다는 것은 제목이 있음을 의미합니다. 따라서 테이블을 사용하여 출력을 포맷하면 코드의 의미론 해석을 오도하고 있습니다.

예를 들어 스크린 리더를 사용하는 사람들의 접근성 문제로 이어질 수 있습니다.

Answer 4

여기에 있습니다 DIV 기반 및 테이블 기반 디자인의 장단점.

Answer 5

DIV 사용은 디자인에서 쉽게 제어하기 때문에 테이블을 사용하는 것보다 낫고 테이블보다 컨트롤 용 컨테이너가 될 수 있으며 테이블은 Simillar 구조로 데이터를 그룹화하는 데 사용되는 메인이므로 디자인은이 작업을위한 것이지만 DIV는 컨테이너로 간주됩니다. 주로 테이블보다. 나는 많은 컨트롤을 수집 할 때와 컨테이너를 제어 할 수있는 것 사이의 차이를 발견했지만 표에서 내부를 삽입하고 서로 안쪽을 삽입해야하기 때문에 혼란스러워졌습니다.

Answer 6

대부분의 사람들은 테이블이 데이터에만 사용되는 방법에 대해 계속하고 레이아웃 목적으로 사용할 때 성능 문제를 도입합니다. 또한, 그것은 당신이 만들 수 있기 때문에 더 유연해야합니다.u003Cdiv> 왼쪽으로 흐르고 흐르고 다른 곳에서 흐릅니다.

그러나 IMHO는 노력의 가치가 없습니다. 특히 해당 레이블과 제대로 정렬 해야하는 컨트롤 열이있을 때는 제대로 정렬되는 데 너무 오래 걸립니다.

Answer 7

레이아웃에 테이블을 사용하는 것은 웹 디자인의 경우 혁신적인 것이었지만 15 년 전이었고 다른 대안은 없었습니다. 이 역사 때문에 오늘날 테이블이 레이아웃을 위해 고려 된 것입니다.

CSS 기반 레이아웃은 테이블 기반 레이아웃보다 훨씬 유연합니다. 테이블로 달성하기가 더 쉬운 몇 가지가 여전히 있지만, 반면에 테이블과 관련하여 매우 복잡하거나 불가능한 CSS와 쉽게 할 수있는 많은 것들이 있습니다.

Answer 8

나는 당신에게 divs를 사용하는 나의 개인적인 주된 이유를 당신에게 말한다 :

• 테이블에는 정적 그리드가있는 반면 DIV는 동적입니다. 테이블의 첫 번째 행은 MS Excel과 같은 모든 COL을 정의합니다. 다음 행에서는 COL을 결합 할 수 있지만 첫 번째 행 내에서 정의한 기본 레이아웃을 변경할 수는 없습니다. divs는 역동적입니다 : 패치 워크를 만들어 divs가 겹치거나 공간을 둘러 볼 수 있습니다. 당신이 원하는 것은 무엇이든. 당신은 줄로 생각해야합니다. 당신은 무료입니다. 훨씬 더 많은 유연성.

• 테이블은 렌더링 및 크로스 브라우저 비 호환성 문제를 유발합니다. 테이블은 항상 동일하게 보이지 않습니다. 각 브라우저는 테이블과 콘텐츠에 대한 자체 해석을 제공합니다. 따라서 많은 불편한 놀라움. 하나의 브라우저는 일반 텍스트를 대담한 글꼴로 표시합니다. 다른 브라우저는 테이블이 다른 HTML 요소에 다소 마진을 제공하므로 테이블은 잘 배치되지 않았습니다. 복잡한 해결 방법으로 이러한 문제를 해결하는 데 시간이 걸립니다. DIV는 항상 모든 브라우저에서 동일하게 보입니다. IE (WebProgrammers의 문제를 제기하는 사람으로 잘 알려진 사람)조차도 DIV를 사용하는 경우 더 적은 문제를 일으키고 있습니다.

• divs는 더 빠르게 렌더링됩니다 : Divs는 테이블보다 빠르게로드됩니다. 페이지 간 탐색이 더 빠릅니다. 더 나은 외모와 느낌.

도움이되기를 바랍니다. 건배.

Answer 9

나는 CSS와 테이블과 때로는 div를 사용하고 있지만 테이블은 매우 포괄적입니다! 그리고 그들은 Dreamweaver, FrontPage에서 너무 멋져 보입니다 ... 테이블을주기가 너무 어렵지만, 내 페이지를 더 빨리로드 할 필요가 있기 때문에 내가 할 것 같습니다!