Bootstrap cung cấp một số class để tạo slide ảnh.
Ví dụ :
Trong đó :
- Để tạo 1 slide ảnh, bạn cần một id (trong ví dụ này
id = "myCarousel"
) class = "slide carousel"
chỉ rằng đây là <div> chứa các ảnh- Thuộc tính
data-ride="carousel"
để tạo hiệu ứng chuyển động vòng của ảnh - Class
.carousel-indicators
quy định số ảnh có trong slide - Thuộc tính
data-target
xác định nơi hiển thị hình ảnh - Thuộc tính
.data-slide-to
xác định chỉ số hiển thị theo thứ tự - Class
.carousel-inner
quy định các slide trong <div> - Class
.item
định nghĩa nội dung của slide trong <div>, có thể là văn bản hoặc hình ảnh - Class
.active
phải được thêm vào để có thể chạy được slide - Hai bên slide có 2 nút prev/next giúp di chuyển qua lại giữa trong ảnh trong slide
- Class
.left
,.right
,.carousel-control
giúp hiển thị các nút bên trái, bên phải - Thuộc tính
data-slide
(data-slide="prev"
/data-slide="next"
) để di chuyển bằng tay khi click vào - Để thêm chú thích cho mỗi ảnh, cần thêm
<div class = "carousel-caption">
trong mỗi<div class = "item">
0 comments:
Post a Comment