2013-07-06 35 views
24

Tôi cần hiển thị bài đăng và dữ liệu liên quan trong cột lưới khôn ngoan và chắc chắn yêu cầu bảng cho những người sắp xếp các div trong một dòng bằng cách sử dụng phao là một điều tiêu tốn thời gian!Sử dụng các bảng trong HTML 5 có tốt không?

Sẽ đánh giá cao các đánh giá của bạn về Do và không cho bảng trong HTML5!

+7

Nếu dữ liệu là bảng, hãy sử dụng bảng; nếu nội dung của bảng là presentational, không sử dụng bảng. –

+0

Bạn cần hỗ trợ những trình duyệt nào? –

+0

Tất cả các trình duyệt mới nhất và sắp tới! Tôi nghĩ rằng nó đã lỗi thời như HTML5? –

Trả lời

33

đơn giản quy tắc - Sử dụng bảng cho dữ liệu bảng, sử dụng các yếu tố khác để trình bày (thiết kế bố trí sử dụng css) như div, section, aside, nav vv. mang lại ý nghĩa cho nội dung mà họ nắm giữ thay vì sử dụng table cho mọi thứ

Thực tế là, các nhà phát triển đã sử dụng các bảng trong thập niên 90 để soạn thảo bố cục của họ, nhưng giờ đây, thông số CSS3 mới thật tuyệt vời. các bố trí như Flex Box, column-count, hành vi của mô hình hộp có thể được thay đổi bằng cách sử dụng thuộc tính box-sizing, thiết kế đáp ứng ngày càng tốt hơn bằng cách sử dụng các truy vấn @media, lưới vv .. mà bạn không thể đạt được với yếu tố table ... và do đó, table chỉ được sử dụng để lưu trữ dữ liệu dạng bảng.

Tôi đã nhìn thấy nhiều nhà phát triển có một ấn tượng rằng table nên hoàn toàn phớt lờ, và thay vào đó họ sử dụng một toàn bộ rất nhiều div với 100 dòng CSS, áp dụng display: table;table-celltable-row tính chỉ để có được một thẳng bảng duy nhất.

Vì vậy, ngay cả trong HTML5 nó là hoàn toàn OK nếu bạn sử dụng bảng cho dữ liệu bảng ..


From W3 Org : (v4.01)

Bàn không nên được sử dụng hoàn toàn như một phương tiện để bố trí nội dung tài liệu vì điều này có thể gây ra sự cố khi hiển thị với phương tiện không phải là hình ảnh . Ngoài ra, khi được sử dụng với đồ họa, các bảng này có thể buộc người dùng cuộn theo chiều ngang để xem bảng được thiết kế trên hệ thống có màn hình lớn hơn. Để giảm thiểu những vấn đề này, tác giả nên sử dụng style sheets để kiểm soát bố cục thay vì bảng.


From (HTML 5)

Bàn không nên được sử dụng như máy trợ bố trí. Trong lịch sử, nhiều tác giả Web có các bảng trong HTML như một cách để kiểm soát bố cục trang của họ khiến việc trích xuất dữ liệu bảng từ các tài liệu đó trở nên khó khăn. Trong số cụ thể, người dùng các công cụ trợ năng, như trình đọc màn hình, là có khả năng thấy rất khó điều hướng các trang có bảng được sử dụng để bố cục. Nếu bảng được sử dụng cho bố cục, bảng phải được đánh dấu bằng thuộc tính role="presentation" để đại lý người dùng đúng cách đại diện cho bảng thành công nghệ hỗ trợ và truyền đạt đúng cách ý định của tác giả đến các công cụ muốn trích xuất dữ liệu dạng bảng từ tài liệu.

Có nhiều phương án khác nhau để sử dụng bảng HTML cho bố cục, chủ yếu sử dụng định vị CSS và mô hình bảng CSS. [CSS]

+0

bảng sẽ được hỗ trợ trong tương lai? –

+2

@Cruze Tất nhiên họ sẽ được hỗ trợ trong tương lai. Bàn là một phần quan trọng của HTML. – str

5

Theo thông số kỹ thuật, <table> đại diện cho dữ liệu với hơn một tham số và "không được sử dụng như máy trợ bố trí."

Nếu bạn cần hiển thị dữ liệu dạng bảng với nhiều thứ nguyên, thì bạn chắc chắn nên sử dụng bảng. Nếu bạn chỉ cần cột, thì không. Có rất nhiều khung công tác CSS như bootstrap có thể đơn giản hóa các kiểu bạn cần để xây dựng một mạng lưới.

+4

Đó là một trong những điểm mà các phiên bản WHATWG và W3C của thông số mâu thuẫn với nhau. Thông số WHATWG, có, hoàn toàn [cấm] (http://www.whatwg.org/specs/web-apps/current-work/multipage/tabular-data.html#the-table-element) sử dụng các bảng để bố cục và gọi thực hành này là 'không phù hợp'. Mặt khác, [phiên bản W3C] (http://www.w3.org/html/wg/drafts/html/CR/tabular-data.html#the-table-element) chỉ gợi ý rằng 'Bảng * nên không * được sử dụng làm trợ giúp bố trí 'và làm rõ rằng' Nếu một bảng được sử dụng để bố trí, nó phải được đánh dấu bằng thuộc tính 'role =" presentation "' '. –

Các vấn đề liên quan