Thuộc tính caption-side trong CSS



Thuộc tính caption-side trong CSS xác định vị trí của caption trong bảng.

Thuộc tính caption-side có thể nhận giá trị:

  • top: đặt caption bên trên bảng.

  • bottom: đặt caption bên dưới bảng.

  • left: đặt caption bên trái bảng.

  • right: đặt caption bên phải bảng.

Thuộc tính caption-side có thể áp dụng cho:

Tất cả phần tử HTML mà đã được xác định vị trí.

Cú pháp thuộc tính caption-side trong DOM

object.style.captionSide = "left";

Ví dụ thuộc tính caption-side trong CSS

Dưới đây là ví dụ minh họa hiệu ứng của thuộc tính caption-side trong CSS.

<html>
   <head>
   
      <style type="text/css">
         caption.top {caption-side:top}
         caption.bottom {caption-side:bottom}
         caption.left {caption-side:left}
         caption.right {caption-side:right}
      </style>
      
   </head>
   <body>
   
      <table style="width:400px; border:1px solid black;">
         <caption class="top">
         Phan Caption nay se xuat hien o phan ben tren bang
         </caption>
         <tr><td > Cell A</td></tr>
         <tr><td > Cell B</td></tr>
      </table>
      <br />
      
      <table style="width:400px; border:1px solid black;">
         <caption class="bottom">
         Phan Caption nay se xuat hien o phan ben duoi bang
         </caption>
         <tr><td > Cell A</td></tr>
         <tr><td > Cell B</td></tr>
      </table>
      <br />
      
   </body>
</html>
Quảng cáo

Kết quả là:




Zalo Hỗ trợ trực tuyến 24/7 Tư vấn tài liệu, khóa học VietJack
FREE

Công cụ giáo viên

  • Tạo đề online từ PDF / Word
  • Trộn nhiều mã đề, in Offline
  • Giao bài online, Quản lí lớp học
Khám phá công cụ (2048.VN)