Trang chủ
CSS
Bảng CSS
Bảng đáp ứng
Tryit: Một bảng đáp ứng
Chạy ❯
Nhận trang web của
riêng
bạn
×
Thay đổi định hướng
Lưu mã
Thay đổi chủ đề, Tối/Sáng
Đi tới Không gian
bảng <!DOCTYPE html> <html> <head> <style> { border-collapse: thu gọn; chiều rộng: 100%; } thứ, td { text-align: left; phần đệm: 8px; } tr:nth-child(even) {background-color: #f2f2f2;} </style> </head> <body> <h2>Bảng phản hồi</h2> <p>Bảng phản hồi sẽ hiển thị thanh cuộn ngang nếu màn hình quá nhỏ để hiển thị đầy đủ nội dung. Thay đổi kích thước cửa sổ trình duyệt để xem hiệu ứng:</p> <p>Để tạo bảng phản hồi, hãy thêm phần tử vùng chứa (như div) với <strong>overflow-x:auto</strong> xung quanh phần tử bảng:</ p> <div style="overflow-x: auto;"> <table> <tr> <th>Tên</th> <th>Họ</th> <th>Điểm</th> <th> Điểm</th> <th>Điểm</th> <th>Điểm</th> <th>Điểm</th> <th>Điểm</th> <th>Điểm</th> <th>Điểm< /th> <th>Điểm</th> <th>Điểm</th> </tr> <tr> <td>Jill</td> <td>Smith</td> <td>50</td> <td>50</td> <td>50</td> <td>50</td> <td>50</td> <td>50</td> <td>50</td> <td >50</td> <td>50</td> <td>50</td> </tr> <tr> <td>Eve</td> <td>Jackson</td> <td>94< /td> <td>94</td> <td>94</td> <td>94</td> <td>94</td> <td>94</td> <td>94</td > <td>94</td> <td>94</td> <td>94</td> </tr> <tr> <td>Adam</td> <td>Johnson</td> <td >67</td> <td>67</td> <td>67</td> <td>67</td> <td>67</td> <td>67</td> <td>67 </td> <td>67</td> <td>67</td> <td>67</td> </tr> </table> </div> </body> </html>