Bootstrap là một khung CSS miễn phí và mã nguồn mở hướng vào phát triển web đầu tiên đáp ứng, di động. Nó chứa các mẫu thiết kế dựa trên CSS và JavaScript cho kiểu chữ, biểu mẫu, nút, điều hướng và các thành phần giao diện khác.
Bài : Tổng quan Boostrap I Bootstrap gì? - Bootstrap Font-end Framework , thư viện mạnh mẽ tích hợp nhiều CSS có sẵn giúp cho việc lập trình HTML & CSS trở nên đơn giản dễ dàng - Thơng thường lập trình CSS cơng vi ệc ki ểm tra tính t ương thích trình duyệt khác thi ết bị di động khác khó khăn, với Bootstrap lập trình viên khơng cần phải tốn nhiều cơng sức th ứ có Bootstrap x lý - Bootstrap chia layout trang web thành 960 Grid gồm 12 cột, cột 80 Grid chuẩn thiết kế HTML & CSS Bootstrap Nó có h ỗ trợ hầu hết module c m ột trang web menu, tabs, tooltip, popup, - Ngồi sử dụng thêm Javascript để xử lý hi ệu ứng c ấp cao, code javascript sử dụng jquery nên để sử dụng bắt buộc bạn phải bổ sung thêm thư viện jQuery - Trang chủ Boostrap: http://getboostrap.com II Tại nên sử dụng Boostrap? Thiết kế đẹp: Bootstrap thiết kế chuyên gia hàng đầu, nên mặt thẩm mỹ tuyệt vời Hỗ trợ trình duyệt: Boostrap hỗ trợ tất trình duyệt phổ biến Dễ học: Chỉ cần có chút kiến thức HTML – CSS bạn làm việc với Bootstrap cách đơn giản Responsive Web Design: Từ phiên 3, Bootstrap có sẵn Responsive Web Design để tương thích với tất loại thiết bị (Desktop, tablet, mobile,…) Tốc độ thiết kế nhanh: Để thiết kế giao diện website, bạn sử dụng Boostrap thời gian bạn hoàn thành nhanh so với việc bạn tự viết HTML – CSS Hiện đại: Bootstrap thiết kế phù hợp với xu hướng công nghệ thiết kế web III Quy trình sử dụng Bootstrap Thiết lập trước sử dụng - Bước 1: Download phiên Boostrap http://getbootstrap.com Chọn sau : - Bước 2: Nhúng CSS, Javascript Bootstrap vào HTML Khi download Boostrap về, bạn thấy cấu trúc file sau: Trong Bootstrap có nhiều file, bạn quan tâm cho file sau đây: Ø CSS: Bootstrap.css, boostrap.min.css Ø JS: bootstrap.js, bootstrap.min.js Ø Fonts: Tồn thư mục Trong đó: bootstrap.css bootstrap min.css có tác dụng Bootstrap.js bootstrap.min.js Min có nghĩa nén file khơng có Các khoảng trắng file loại bỏ giúp giảm dung lượng file Tiếp theo, bạn nhúng file CSS, JS vào file HTML theo cú pháp sau: Chú ý: File jquery-1.11.3.min.js download jquery.com - Bước 3: Cách sử dụng Bootstrap Các bạn cần gọi tên class CSS phù hợp với thẻ HTML mà Bootstrap quy định sẵn Đến ta hoàn tồn sử dụng tính Boostrap mà tìm hiểu sau Ví dụ: ... Thiết lập trước sử dụng - Bước 1: Download phiên Boostrap http://getbootstrap.com Chọn sau : - Bước 2: Nhúng CSS, Javascript Bootstrap vào HTML Khi download Boostrap về, bạn thấy cấu trúc file sau:... File jquery -1. 11. 3.min.js download jquery.com - Bước 3: Cách sử dụng Bootstrap Các bạn cần gọi tên class CSS phù hợp với thẻ HTML mà Bootstrap quy định sẵn Đến ta hoàn toàn sử dụng tính Boostrap. .. Boostrap về, bạn thấy cấu trúc file sau: Trong Bootstrap có nhiều file, bạn quan tâm cho file sau đây: Ø CSS: Bootstrap.css, boostrap. min.css Ø JS: bootstrap.js, bootstrap.min.js Ø Fonts: Toàn thư