CSS – Cách loại bỏ hoàn toàn đường viền khỏi bảng HTML

Css Cach Loai Bo Hoan Toan Duong Vien Khoi Bang Html



Bảng là một thành phần chính của trang HTML được sử dụng để lưu trữ và sắp xếp dữ liệu. Các nhà phát triển có thể thiết kế bảng HTML bằng cách sử dụng các thuộc tính CSS, chẳng hạn như màu nền, đường viền, lề, phần đệm, v.v. CSS “ ranh giới ” thuộc tính được sử dụng để đặt đường viền xung quanh bảng và ô. Tuy nhiên, trong một số trường hợp, người dùng không yêu cầu đường viền để tạo kiểu.

Bài đăng này sẽ giải thích cách xóa hoàn toàn đường viền khỏi HTML bằng CSS.

Làm cách nào để loại bỏ hoàn toàn đường viền khỏi bảng HTML?

Nếu người dùng muốn xóa hoàn toàn đường viền khỏi bảng HTML, hãy xem hướng dẫn.







Bước 1: Tạo bảng có viền

Để tạo bảng trong HTML, hãy làm theo hướng dẫn:



  • Đầu tiên, thêm một phần tử bảng “ ” cùng với “ ranh giới ' thuộc tính.
  • Sau đó, “ ” thẻ được thêm vào để tạo số lượng hàng mong muốn.
  • Các ô tiêu đề được chỉ định bằng cách sử dụng “ ” thẻ.
  • Sau đó, ' ” thẻ được bao gồm trong “ khác ” thẻ để thêm ô dữ liệu:
< cái bàn ranh giới = '1px' >

< tr > < thứ tự > Tên < / thứ tự > < thứ tự > TÔI < / thứ tự > < thứ tự > Loại < / thứ tự >< / tr >

< tr > < td > cú chọc < / td > < td > 001 < / td > < td > Một < / td >< / tr >

< tr > < td > Đại dương < / td > < td > 002 < / td > < td > b < / td >< / tr >

< tr > < td > To lớn < / td > < td > 003 < / td > < td > C < / td >< / tr >

< / cái bàn >

Để tạo kiểu cho bảng HTML, chúng tôi sẽ sử dụng các thuộc tính CSS sau:



>

cái bàn {

đệm : 10px ;

lề : tự động ;

ranh giới : 1px chất rắn đen :

}

>

Bên trong “ ”, hãy truy cập phần tử

bằng cách sử dụng thẻ của nó. Sau đó, áp dụng các thuộc tính sau:





  • lề ” tài sản có giá trị “ tự động ” được sử dụng để đặt khoảng cách bằng nhau xung quanh phần tử.
  • đệm ” tài sản có giá trị “ 10px ” đặt không gian 10px xung quanh nội dung của phần tử.
  • ranh giới ” áp dụng đường viền xung quanh bảng.

đầu ra



Bước 2: Xóa viền trong CSS

Để xóa đường viền khỏi bảng, người dùng được yêu cầu đặt “ ranh giới ” tài sản như “ không ai ”:

cái bàn {

đệm : 10px ;

lề : tự động ;

ranh giới : không ai ;

}

Có thể quan sát thấy rằng đường viền ngoài của bảng đã được xóa thành công:

Bước 3: Xóa hoàn toàn đường viền Bảng

Hơn nữa, nếu bạn muốn xóa toàn bộ đường viền khỏi bảng cũng như khỏi các ô, hãy đặt “ ranh giới ” tài sản như “ không ai ” trên tất cả các yếu tố, bao gồm cả “ cái bàn ”, “ tr ”, “ thứ tự ', và ' td ”:

bảng, tr, td, th{

phần đệm: 10px;

ký quỹ: tự động;

biên giới: không có;

}

Đầu ra bên dưới cho biết rằng chúng tôi đã xóa hoàn toàn đường viền khỏi bảng HTML:

Chúng tôi đã trình bày phương pháp loại bỏ hoàn toàn đường viền khỏi bảng HTML.

Phần kết luận

Để loại bỏ hoàn toàn đường viền khỏi bảng HTML, trước tiên hãy tạo một bảng. Sau đó, áp dụng thuộc tính CSS “ ranh giới ”, “ đệm ', và ' lề ' trên bàn. Sau đó, đặt thuộc tính đường viền là “ không ai ” trên tất cả các phần tử của bảng, chẳng hạn như “ cái bàn ”, “ tr ”, “ td ', và ' thứ tự ”. Hướng dẫn này đã trình bày phương pháp loại bỏ hoàn toàn đường viền khỏi bảng HTML.