2008-12-03 56 views
50

Tôi không biết tại sao điều này làm phiền tôi rất nhiều, nhưng khi tôi tạo trang web, tôi luôn cố gắng làm tất cả kiểu dáng của mình bằng CSS. Tuy nhiên, một điều tôi luôn phải nhớ khi làm việc với các bảng là thêm cellspacing = "0" và cellpadding = "0"Tại sao cellspacing và cellpadding không phải kiểu CSS

Tại sao không có thuộc tính CSS để ghi đè các thuộc tính HTML 4 lỗi thời này?

Trả lời

63

Cellspacing:

table { border-collapse: collapse; } 

Đối với cellpadding, bạn có thể làm

table tr td, table tr th { padding: 0; } 
+1

Cảm ơn vì điều đó, tôi chưa bao giờ thực sự hiểu được sự sụp đổ của biên giới được cho là có ý nghĩa gì. Tôi sẽ phải bắt đầu sử dụng thay vì sử dụng cách thuộc tính HTML cũ. –

+0

Vâng, nếu không có sự sụp đổ biên giới, nếu có hai ô liền kề có đường viền 1px, thì bạn sẽ có đường viền 2px, vì đường viền là các vùng kề nhau, với đường viền sụp đổ, đường viền, tốt, được thu gọn: -) – mat

+17

Lưu ý rằng 'border-collapse: collapse' tạo ra hiệu ứng hình ảnh hoàn toàn khác với' cellspacing = "0" '; hai phương pháp không thực sự tương đương hoặc hoán đổi cho nhau theo bất kỳ cách có ý nghĩa hoặc hữu ích nào. – Martha

1
table { border-collapse:collapse; } 
0

Tôi đoán ai đó coi tế bào khoảng cách một “thói quen xấu”. Làm thế nào tôi hiểu nó là tương đương bao gồm trong tiêu chuẩn CSS2 nhưng IE không hỗ trợ tài sản này. border-collapse cho phép đặt khoảng cách thành 0 giá trị. Ô đệm có thể đạt được thiết lập thuộc tính đệm cho các phần tử TD của một bảng.

40

mat đã trả lời, nhưng chỉ cho đầy đủ:

  • paddingcellpadding
  • border-spacingcellspacing
  • border-collapse → không chứa mã HTML tương đương

Nó cũng đáng ghi nhớ rằng bạn có thể đặt các giá trị ngang và dọc riêng biệt cho các ví dụ CSS border-spacing: 0 1px.

+1

+1 cho khoảng cách đường viền. border-collapse trong trường hợp của tôi tạo ra các đường viền in đậm lạ trong một số bảng, nhưng khoảng cách biên giới: 0; thực sự làm tương tự như thuộc tính cellspacing = "0px" trong phần tử bảng. – Ignas2526

8

Eric Myer reset stylesheet chứa sau 'reset' phong cách cho bảng:

/* tables still need 'cellspacing="0"' in the markup */ 
table { 
    border-collapse: collapse; 
    border-spacing: 0; 
} 

Ngoài ra TD, TR được đặt lại:

thead, tr, th, td { 
    margin: 0; 
    padding: 0; 
    border: 0; 
    outline: 0; 
    font-size: 100%; 
    vertical-align: baseline; 
    background: transparent; 
} 

Lý do tôi đề cập đến điều này là ông có một lời nhận xét 'bảng vẫn cần cellpadding = 0'. Tôi cho rằng anh ta đặt cái này vào đây vì một lý do - có lẽ là cần thiết bởi một số trình duyệt cũ. Đánh giá bởi thực tế rằng đây là một trong số rất ít ý kiến ​​ông đưa vào, tôi đoán nó quan trọng và có lý do chính đáng cho nó.

Dựa trên nhận xét này - và nhận xét này một mình! - Tôi đang tiếp tục sử dụng cellspacing = "0" trong đánh dấu trừ khi ai đó nói với tôi dứt khoát (dưới đây) tại sao tôi không cần. Tuy nhiên nó có thể là không cần thiết trong bất kỳ trình duyệt hiện đại có giá trị hỗ trợ những ngày này.

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