Table of Contents
Bootstrap là gì?
Bootstrap là một framework front-end miễn phí, mã nguồn mở, được sử dụng rộng rãi để phát triển giao diện người dùng web và ứng dụng web. Nó chứa các template HTML, CSS và JavaScript cho các thành phần giao diện người dùng phổ biến như typography, forms, buttons, navigation và các thành phần giao diện khác. Bootstrap giúp việc thiết kế web trở nên nhanh chóng và dễ dàng hơn, đặc biệt là cho những người mới bắt đầu.
Sử dụng Bootstrap giúp tiết kiệm thời gian, đơn giản hóa quá trình thiết kế và đảm bảo tính thẩm mỹ cho giao diện website.
Những điều cần biết về Bootstrap
Lịch sử hình thành và phát triển của Bootstrap
Bootstrap ban đầu được phát triển tại Twitter bởi Mark Otto và Jacob Thornton với tên gọi Twitter Blueprint. Nó được phát hành dưới dạng mã nguồn mở trên GitHub vào ngày 19/8/2011. Phiên bản Bootstrap 3, ra mắt vào 19/8/2013, đã trở thành một trong những dự án phổ biến nhất trên GitHub.
Bootstrap là gì – Những điều cần biết về Bootstrap
Có nên sử dụng Bootstrap?
Bootstrap được nhiều lập trình viên ưa chuộng bởi tính dễ sử dụng, khả năng tùy chỉnh cao và cơ chế hoạt động mở. Nó tạo ra các website chất lượng, tương thích với nhiều trình duyệt và nền tảng, bao gồm cả thiết bị di động. Bootstrap tự động điều chỉnh kích thước và giao diện để phù hợp với màn hình người dùng.
3 File chính của Bootstrap
Bootstrap gồm 3 file chính:
- Bootstrap CSS: Quản lý bố cục website.
- Bootstrap JS: Chứa JavaScript, sử dụng jQuery để thêm tính năng động cho website.
- Glyphicons: Bộ sưu tập icon đa dạng, giúp website thêm sinh động.
Tính năng của Bootstrap
- Modular: Được thiết kế theo module, dễ dàng tích hợp với nhiều mã nguồn mở.
- Thư viện phong phú: Cung cấp nhiều thành phần giao diện, tùy chỉnh framework, tái sử dụng code, tích hợp jQuery và giảm thiểu sử dụng hình ảnh, giúp tăng tốc độ tải trang.
- File nén: Dễ dàng tải xuống, sử dụng và lưu trữ.
Hướng dẫn cài đặt Bootstrap
Tải trực tiếp từ website
Truy cập trang chủ Bootstrap: https://getbootstrap.com/ và tải xuống tại mục Download.
Tải qua CDN Bootstrap
- Truy cập trang chủ Bootstrap: https://getbootstrap.com/.
- Sao chép mã CDN Bootstrap vào thẻ
<head>của trang HTML. Bạn có thể tìm kiếm “Bootstrap CDN” trên công cụ tìm kiếm để tìm mã CDN.
Hướng dẫn nhúng Bootstrap vào HTML
Nhúng bằng liên kết CDN
Sao chép mã CDN từ trang chủ Bootstrap và dán vào thẻ <head> của trang HTML.
Nhúng bằng cách tự Host
- Tải Bootstrap từ trang chủ.
- Giải nén file tải về.
- Sao chép các file CSS và JS vào thư mục dự án của bạn.
- Nhúng các file CSS và JS vào thẻ
<head>của trang HTML.
Bootstrap là gì – Nhúng từ liên kết của Bootstrap
Hướng dẫn sử dụng Bootstrap 4
Bootstrap là gì – Hướng dẫn sử dụng Bootstrap 4 chi tiết
Thêm HTML Doctype
Bootstrap 4 sử dụng HTML5. Thêm HTML5 Doctype vào đầu trang HTML.
Bootstrap 4 Mobile First
Thêm thẻ <meta> với width=device-width và initial-scale=1 để tối ưu hiển thị trên thiết bị di động.
Bootstrap 4 Containers
- Container: Tạo chiều rộng phù hợp với nội dung website.
- Container-fluid: Tạo container full-width, chiếm toàn bộ chiều rộng màn hình.
Bootstrap 4 Grid System
Grid System chia giao diện thành 12 cột, giúp bố trí nội dung linh hoạt trên các thiết bị khác nhau.
Nguyễn Lân Tuất là nhà khoa học người Việt Nam trong lĩnh vực vật liệu tiên tiến, hiện đang làm việc tại Đức (wiki). Ông xuất thân từ dòng họ Nguyễn Lân, gia đình có truyền thống hiếu học. Với nhiều năm nghiên cứu và giảng dạy, ông đã đóng góp quan trọng trong công nghệ vật liệu, đặc biệt là màng mỏng và vật liệu chức năng, với các ứng dụng thực tiễn trong công nghiệp và khoa học.