Thẻ figure trong HTML thuộc HTML5 dùng để chứa các thẻ nội dung đa phương tiện như: hình ảnh, video,... và thẻ figcaption để chú thích, chi tiết như nào hãy cùng chúng tôi phân tích:

Thẻ figure trong HTML

Chức năng của Thẻ figure trong HTML

Thẻ figure trong HTML thuộc HTML5 dùng để chứa các thẻ nội dung đa phương tiện như: hình ảnh, video, biểu đồ, sơ đồ,....và thẻ figcaption để chú thích cho các nội dung đa phương tiện đó để giúp mô tả rõ hơn cho người dùng và các công cụ tìm kiếm.

Code Thẻ figure trong HTML

Thẻ figure mặc định trong HTML

<figure>
  <img src="https://webmoi.vn/thumuc/ceo-bui-tan-luc.jpg" alt="CEO Bùi Tấn Lực" style="width:300px;height:auto">
  <figcaption>CEO Bùi Tấn Lực</figcaption>
</figure>

Chạy Thử

Css cho Thẻ figure trong HTML

<!DOCTYPE html>
<html>
<head>
<title>Css cho Thẻ figure trong HTML</title>
<style>
figure {
  border: 1px #cccccc solid;
  padding: 4px;
  margin: auto;
}

figcaption {
  background-color: black;
  color: white;
  font-style: italic;
  padding: 2px;
  text-align: center;
}
</style>
</head>
<body>
<h1>Css cho Thẻ figure trong HTML</h1>
<figure>
  <img src="https://webmoi.vn/thumuc/ceo-bui-tan-luc.jpg" alt="CEO Bùi Tấn Lực" width="100%">
  <figcaption>CEO Bùi Tấn Lực</figcaption>
</figure>
</body>
</html>

Chạy Thử

Lời kết

Cảm ơn các bạn đã tham khảo bài viết Thẻ figure trong HTML.

5/5 - (1 Đánh giá)
0 Bình luận

Bùi Tấn Lực

CEO Bùi Tấn Lực người sáng lập ra Web Mới, là một lập trình viên website, người viết content, chuyên tư vấn các vấn đề về website và SEO website

Chia sẻ nội dung đánh giá của bạn về Thẻ figure trong HTML
Email, Điện thoại của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *

Bình luận, Hỏi đáp

Đăng ký tư vấn miễn phí

Tìm hiểu 1 năm không bằng lắng nghe 1 câu tư vấn