Phương pháp 1: Sử dụng Thuộc tính HTML “chiều rộng”
Các ' chiều rộng ” là một thuộc tính cơ bản được cung cấp bởi HTML. Nó đặt chiều rộng hoặc chiều dài ngang của phần tử HTML. Để sửa dữ liệu bảng, thuộc tính chiều rộng được sử dụng trong các bước bên dưới.
Bước 1: Tạo bảng Bước 2: Thêm Thuộc tính CSS vào Phần tử “bảng” Bước 3: Gán thuộc tính cho phần tử “td” Bước 4: Gán thuộc tính cho phần tử “th” Đầu ra được hiển thị dưới dạng: Ảnh chụp nhanh ở trên cho thấy rằng tất cả các chiều rộng của cột được cố định ở mức 30% mỗi cột. Thuộc tính nth-child() của CSS được sử dụng để tạo bảng có chiều rộng cố định. Thuộc tính này lấy số cột và chọn “ Đầu ra của khối mã trên là: Đầu ra này hiển thị rằng cột số 1 và 3 được cố định với chiều rộng là 10%. Bên trong “ bàn ” trong phần CSS thêm phần “ bố trí bảng: cố định ” để đặt “chiều rộng” của các thành phần bảng dữ liệu: Trong tệp HTML, hãy thêm “ Sau khi thực hiện đoạn mã trên, đầu ra là: Đó là cách người dùng có thể sửa chiều rộng của các phần tử Để sửa chiều rộng của dữ liệu bảng, hãy sử dụng “ chiều rộng ' thuộc tính, ' con thứ n( ) ” dấu phân cách và “
Trong tệp HTML, hãy sử dụng một “ ' Và ' ” thẻ và ghi dữ liệu vào đó:
< trung tâm >
< bàn >
< tr >
< quần què > Tên < / quần què >
< quần què > Trạng thái < / quần què >
< quần què > phòng số < / quần què >
< / tr >
< tr >
< td > Fakhar < / td >
< td > Học sinh < / td >
< td > 06 < / td >
< / tr >
< tr >
< td > Omar < / td >
< td > Học sinh < / td >
< td > 06 < / td >
< / tr >
< / bàn >
< / trung tâm >
Sử dụng bộ chọn thành phần bảng trong CSS và thêm “ ranh giới ” của 1px màu đỏ đặc, “ căn chỉnh văn bản ” căn chỉnh văn bản vào giữa và “ chiều rộng ” đặt chiều rộng tổng thể của bảng thành 80%:
bàn {
ranh giới : 1px màu đỏ đặc;
chữ- căn chỉnh : trung tâm;
chiều rộng : 80 %; }
Sử dụng ' td ” bộ chọn phần tử và đặt “ viền dưới ” của 5px màu đỏ đặc, “ đệm ” 20px để làm cho mục nổi bật hơn và “ chiều rộng ” đặt là 30%:
td {
viền dưới: 5px màu đỏ đặc;
phần đệm: 20px;
chiều rộng : 30 %;
}
Sử dụng ' quần què ” bộ chọn phần tử để thay đổi màu của “ viền dưới ” từ đỏ sang xanh biển để tạo hình ảnh rõ hơn:
quần què {
border-bottom: 5px màu xanh biển đặc;
phần đệm: 20px;
chiều rộng : 30 %;
}
Cách 2: Sử dụng Selector “nth-child( )”
' Và ' ” thẻ. Chẳng hạn, chiều rộng là “ đã sửa ” chỉ dành cho số cột “ 1 ' Và ' 3 ”. Mỗi cột này có chiều rộng là 10%. Bài viết này đã trình bày thành công cách sửa chiều rộng bảng dữ liệu. td:nth-con ( 3 ) {
chiều rộng : 10 %;
}
th:nth-con ( 1 ) {
chiều rộng : 10 %;
}
Cách 3: Sử dụng thẻ
bố cục bảng: cố định;
chiều rộng : 80 %;
ranh giới : 1px màu đỏ đặc;
chữ- căn chỉnh : trung tâm;
}
< cột phong cách = 'chiều rộng: 15%;' / >
< cột phong cách = 'chiều rộng: 30%;' / >
dữ liệu bảng.
Phần kết luận
dữ liệu bảng.