Thay đổi màu nền bảng html

Bảng là những phần thiết yếu của trang web của bạn. Chúng được sử dụng để truyền đạt dữ liệu và thông tin quan trọng theo cách dễ hiểu. Về bản chất, bảng là một nhóm hoặc một tập hợp các hàng và cột, mỗi hàng chứa một số loại thông tin nhất định. Ban đầu chúng được dự định là một phần của đánh dấu HTML

Mặc dù bảng là cách trình bày dữ liệu phù hợp, nhưng nhiều nhà thiết kế tránh sử dụng chúng chỉ vì thực tế là chúng có thể trông không hấp dẫn. Tuy nhiên, điều đó có thể được thay đổi với một chút công việc và bằng cách thực hiện một số phương pháp dễ dàng, chẳng hạn như bằng cách thay đổi màu nền của bảng. Không tốn thời gian để dễ dàng làm cho các bảng hấp dẫn với một số điều chỉnh

Bạn sẽ sớm thấy rằng việc trình bày dữ liệu dạng bảng hoạt động tốt nhất trong bảng, như mong đợi. Các ô của bảng thường được sử dụng trong đánh dấu HTML dưới dạng các thành phần chứa nội dung để tạo trang web. Những ô hoặc lưới này là những phần thiết yếu của thiết kế trang web. Đó là lý do tại sao điều quan trọng là bạn phải làm cho các bảng trên trang web của mình hấp dẫn và được đánh bóng tốt

Trong bài viết này được tạo bởi nhóm của chúng tôi tại wpDataTables, chúng tôi sẽ xem xét cách bạn có thể thay đổi và đặt màu nền của bảng một cách dễ dàng. Điều này ít nhất có thể mang lại sự đa dạng cho nội dung

Bảng WordPress

Phiên bản mặc định của WordPress cung cấp cho bạn, người tạo, không có trợ giúp đáng kể nào để tạo hoặc thay đổi bảng. Vì vậy, bạn sẽ phải thực hiện việc này theo cách thủ công. Là người tạo trang WordPress, trước tiên bạn phải bật chế độ Văn bản của trình chỉnh sửa trước khi thay đổi mã HTML và chèn mã cho các bảng vào đó

Ngoài ra, việc điều chỉnh màu nền của bảng phải được thực hiện thủ công. Sau khi tạo bảng, màu nền của bảng sẽ tự động được đặt để khớp với màu nền của chủ đề. Cách duy nhất để làm cho nền bảng trở nên độc đáo là thay đổi các giá trị của mã và triển khai các thay đổi này bằng CSS sau này

Cách thay đổi màu nền của bảng theo cách thủ công

Khi bạn muốn kết hợp một bảng HTML vào trang web của mình, trước tiên bạn có thể muốn tạo kiểu cho nó một chút trước khi đưa thông tin vào các ô của bảng. Ví dụ: bạn có thể thay đổi màu nền của bảng HTML, nhưng có một số thay đổi khác mà bạn có thể thực hiện đối với đường viền bảng, màu cột, v.v.

Thay đổi mã CSS là điều cần thiết cho mọi thay đổi đối với thiết kế bảng. Những thứ như màu nền của bảng được đặt trong mã CSS, cũng như tất cả các thuộc tính của toàn bộ bảng HTML và thuộc tính của các hàng và ô

Bây giờ, hãy xem cách thay đổi màu nền thủ công bằng cách thay đổi mã CSS

Cách thay đổi màu nền của toàn bộ bảng

Để làm điều này, bạn chỉ cần chèn đoạn mã sau

…

Thay đổi màu của hàng trong bảng

Bạn cũng có thể thay đổi màu của một hàng trong bảng riêng lẻ, màu này có thể khác với màu nền của bảng. Khi một hàng riêng lẻ có màu khác với màu nền, hàng bảng mong muốn đó sẽ thu hút sự chú ý của mọi người. Với đoạn mã sau, chúng ta có thể thay đổi màu của một hàng. Màu văn bản cũng được thay đổi

…

Thay đổi màu nền của ô

Just like how you can change the color of an individual row, you can change the color of an individual cell, too. To change the color of a row, you can add the “style” property into the