Quay lại-
0
-
0
-
FacebookGiới thiệu sản phẩm
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<!--Bootstrap-->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/css/bootstrap.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/js/bootstrap.bundle.min.js"></script>
</head>
<body>
<!--
gutter: khoảng cách giữa các cột trong hệ thống lưới
gx-(từ 0-5): thêm khoảng cách theo trục ngang
gy-(từ 0-5): thêm khoảng cách theo trục dọc
-->
<div style = "width: 50% ;" class = "mx-auto mb-5">
<div class = "row gx-5">
<div class = "col-6 bg-primary">
<p class = "bg-warning">Cột 1 </p>
</div>
<div class = "col-6 bg-success">
<p class = "bg-danger">Cột 2 </p>
</div>
<div class = "col-6 bg-primary">
<p class = "bg-warning">Cột 3 </p>
</div>
<div class = "col-6 bg-success">
<p class = "bg-danger">Cột 4 </p>
</div>
</div>
</div>
<!--
Width: chiều ngang
height: chiều cao(chỉ có tác dụng khi chiều cao của màn hình bằng một con số nhất định)
w-(25,50,75,100)
h-(25,50,75,100)
-->
<div class = "bg-warning" style = "height:300px">
<div class = "bg-primary w-25">Hello</div>
</div>
<!--
offcanvas : là menu trượt từ cạnh màn hình vào
-->
<button class = "btn btn-primary" data-bs-toggle = "offcanvas" data-bs-target = "#Menu"></button>
<div class = "offcanvas offcanvas-start " id = "Menu">
<div class = "offcanvas-header">
<h5>Menu</h5>
<button class = "btn-close" data-bs-dismiss = "offcanvas"></button>
</div>
<div class = "offcanvas-body">
<a href="">home</a>
</div>
</div>
</body>
</html>
Hãy bình luận để nhặt 100 thóc nhé
Sản phẩm cùng tác giả
-
Nhà sáng tạo Nguyễn Trung Dũngbuổi 12 -
Nhà sáng tạo Nguyễn Trung Dũngbuổi 5 -
Nhà sáng tạo Nguyễn Trung DũngBuổi 4
Đăng nhập để tham gia bình luận