Bóng
Bài học 6 trên 8 trong khóa học Dự án CSS: nút bấm bắt mắt của Coddy.
Thêm hiệu ứng đổ bóng cho nút là cách phổ biến để tạo cảm giác nút nổi lên và có thể nhấn được.
Để thêm bóng trong CSS, ta dùng thuộc tính box-shadow:
#with-shadow {
box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25)
}
Thử thách
DễThêm bóng đổ cho nút của bạn!
Gợi ý: bạn nên dùng màu
rgba(0, 0, 0, 0.25)làm màu bóng đổ (bạn có thể thay đổi độ mờ đục, 0.25)
Tự làm thử
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<!-- Viết code HTML ở đây -->
</body>
</html>Tất cả bài học trong Dự án CSS: nút bấm bắt mắt
Tự luyện tập: Playground Web