Tất cả bài viết | Bootstrap
Cách tạo thông báo bằng Bootstrap Alerts
Trong bài học thiết kế web này các Bạn sẽ được Hướng dẫn Cách tạo thông báo bằng Bootstrap Alerts
Bước 1: Tạo cấu trúc HTML
Cách tạo thông báo bằng Bootstrap Alerts
Gọi ngay cho chúng tôi để đăng ký học. Điện thoại: 0199 257 6350 - 0932 152 592Gọi ngay cho chúng tôi để đăng ký học. Điện thoại: 0199 257 6350 - 0932 152 592Gọi ngay cho chúng tôi để đăng ký học. Điện thoại: 0199 257 6350 - 0932 152 592Gọi ngay cho chúng tôi để đăng ký học. Điện thoại: 0199 257 6350 - 0932 152 592Gọi ngay cho chúng tôi để đăng ký học. Điện thoại: 0199 257 6350 - 0932 152 592Gọi ngay cho chúng tôi để đăng ký học. Điện thoại: 0199 257 6350 - 0932 152 592
Bước 2: Định dạng CSS
.notice {
padding: 15px;
background-color: #fafafa;
border-left: 6px solid #7f7f84;
margin-bottom: 10px;
-webkit-box-shadow: 0 5px 8px -6px rgba(0, 0, 0, .2);
-moz-box-shadow: 0 5px 8px -6px rgba(0, 0, 0, .2);
box-shadow: 0 5px 8px -6px rgba(0, 0, 0, .2);
}
.notice-sm {
padding: 10px;
font-size: 80%;
}
.notice-lg {
padding: 35px;
font-size: large;
}
.notice-success {
border-color: #80D651;
}
.notice-success>strong {
color: #80D651;
}
.notice-info {
border-color: #45ABCD;
}
.notice-info>strong {
color: #45ABCD;
}
.notice-warning {
border-color: #FEAF20;
}
.notice-warning>strong {
color: #FEAF20;
}
.notice-danger {
border-color: #d73814;
}
.notice-danger>strong {
color: #d73814;
}
Bước 3: Gọi thư viện Bootstrap và Font awesome
Bước 4: Gọi thư viện JQUERY
Bootstrap Xem (2177) Học thiết kế web giá rẻ
