Hướng dẫn how to make table border invisible in html - cách làm cho đường viền bảng ẩn trong html

Tôi biết đây là một câu hỏi đã được hỏi, nhưng tôi đã thử một số giải pháp (chẳng hạn như cách tạo các đường/đường viền phân tách trong bảng biến mất với CSS?) Nhưng tôi vẫn không thể hiểu được.

Tôi đã xác định thông qua CSS một cấu trúc bảng với các màu hàng xen kẽ. Tôi muốn các đường viền (đặc biệt theo chiều dọc) giữa các tế bào TEH là vô hình và vì vậy, giả sử tôi cần một chiều rộng biên giới TD bằng không, hoặc các màu đường viền TD xen kẽ giống như màu nền.

Ví dụ dưới đây là những gì tôi đã thử, khi gọi ID Bảng1 từ HTML, tôi nhận được một bảng hàng màu xen kẽ đẹp nhưng vẫn còn đường viền tế bào rõ ràng vẫn còn - đánh giá cao sự giúp đỡ của bạn.

#table1 table, tr, td, th {
     border: 0;
}

#table1 tbody tr:nth-child(odd) {
     background-color: #A3B9D2; 
}

#table1 tbody tr:nth-child(even) {
     background-color: #E7EDF3;
}

và sau đó lấy mẫu HTML;

   

     
Test
(value)
   
   

     
Test2
(value2)
   

hỏi ngày 8 tháng 2 năm 2012 lúc 5:19Feb 8, 2012 at 5:19

1

Có thể những gì bạn đang mô tả là CellSpaces. Nếu đó là trường hợp, hãy thử điều này trong HTML của bạn:

  ...

Tế bào đề cập đến không gian giữa các ô; Nó không phải là một biên giới chính xác. Vì vậy, nếu bạn đang nhìn thấy các không gian vô hình hoặc không màu giữa TDS của bạn, hãy thử thêm thuộc tính CellSpaces = "0" vào thẻ bảng của bạn.

Đã trả lời ngày 8 tháng 2 năm 2012 lúc 5:28Feb 8, 2012 at 5:28

Tracy Futracy FuTracy Fu

1.63212 Huy hiệu bạc22 Huy hiệu đồng12 silver badges22 bronze badges

2

Bạn cũng có thể sử dụng kiểu này:

#table1 {border:0px solid transparent;} 

Đã trả lời ngày 8 tháng 2 năm 2012 lúc 5:26Feb 8, 2012 at 5:26

ThegeekyouneedthekyouneedTheGeekYouNeed

7.4792 Huy hiệu vàng26 Huy hiệu bạc42 Huy hiệu đồng2 gold badges26 silver badges42 bronze badges

Thử cái này

#table1 {
   border-collapse: collapse;
}

Đã trả lời ngày 8 tháng 2 năm 2012 lúc 5:31Feb 8, 2012 at 5:31

NewusernewuserNewUser

12.5K37 Huy hiệu vàng142 Huy hiệu bạc233 Huy hiệu Đồng37 gold badges142 silver badges233 bronze badges

Sử dụng cellspacing="0" thực sự là một cách chắc chắn để loại bỏ những dòng phiền phức đó. Nhưng, cá nhân tôi, tôi chưa bao giờ thích nó - bởi vì tôi phải áp dụng nó trong mỗi bảng mà tôi tạo trên khắp một trang web, thay vì ở một điểm gọn gàng, tập trung.

Vì vậy, tôi thường đi cho một giải pháp như Elclanrs trong tệp CSS. Điều thú vị về giải pháp đó là bạn có thể xóa một số thẻ trước nó để áp dụng các dòng/đường viền chỉ cho những thứ đó.

Vì vậy, nói cách khác, để đặt một đường viền quanh một bảng - mà không có tất cả các ô được chia thành giữa các dòng - bạn có thể làm điều gì đó như thế này:

tr, td, th
{
  border: 0;
}

Chúc may mắn!

Đã trả lời ngày 2 tháng 8 năm 2012 lúc 15:59Aug 2, 2012 at 15:59

#table1 table, tr, td, th {} là sai.

Bạn nên làm:

#table1,
#table1 tr,
#table1 td { border: 0; }

Đã trả lời ngày 8 tháng 2 năm 2012 lúc 5:26Feb 8, 2012 at 5:26

Thegeekyouneedthekyouneedelclanrs

7.4792 Huy hiệu vàng26 Huy hiệu bạc42 Huy hiệu đồng21 gold badges132 silver badges169 bronze badges

2

Thử cái nàywithin table1. The first declaration should actually be:

Đã trả lời ngày 8 tháng 2 năm 2012 lúc 5:31

Newusernewuser

12.5K37 Huy hiệu vàng142 Huy hiệu bạc233 Huy hiệu Đồng

Sử dụng cellspacing="0" thực sự là một cách chắc chắn để loại bỏ những dòng phiền phức đó. Nhưng, cá nhân tôi, tôi chưa bao giờ thích nó - bởi vì tôi phải áp dụng nó trong mỗi bảng mà tôi tạo trên khắp một trang web, thay vì ở một điểm gọn gàng, tập trung.Feb 8, 2012 at 5:24

Vì vậy, tôi thường đi cho một giải pháp như Elclanrs trong tệp CSS. Điều thú vị về giải pháp đó là bạn có thể xóa một số thẻ trước nó để áp dụng các dòng/đường viền chỉ cho những thứ đó.Christophe

Vì vậy, nói cách khác, để đặt một đường viền quanh một bảng - mà không có tất cả các ô được chia thành giữa các dòng - bạn có thể làm điều gì đó như thế này:25 gold badges95 silver badges138 bronze badges

Chúc may mắn!

http://jsfiddle.net/RmhxH/

Đã trả lời ngày 2 tháng 8 năm 2012 lúc 15:59Feb 8, 2012 at 5:36

#table1 table, tr, td, th {} là sai.Ricardo Tomasi

Bạn nên làm:2 gold badges55 silver badges66 bronze badges

Elclanrselclanrs

table,td,tr,th{
  border:0;
}

91.1K21 Huy hiệu vàng132 Huy hiệu bạc169 Huy hiệu đồng

Có vẻ như bạn đang áp dụng phong cách cho các bảng trong Bảng1. Tuyên bố đầu tiên thực sự nên là:4 gold badges30 silver badges44 bronze badges

#Bảng1 {Biên giới: 0; }Jul 7, 2017 at 10:55

0

Làm cách nào để làm cho một bàn biên trong suốt?

Làm cách nào để ẩn một đường viền trong HTML?

Làm thế nào để bạn làm cho một biên giới vô hình trong CSS?