Bootstrap là nền tảng framework HTML, CSS hay JavaScript cho phép lập trình viên có thể thiết được được website dựa trên responsive web mobile. Nếu như bạn chưa hiểu rõ về bootstrap là gì thì có thể tham khảo thông tin ở bài viết dưới đây.
Nội dung chính
Lịch sử hình thành Bootstrap
Bootstrap được xây dựng và phát triển bởi Mark Otto và Jacob Thornton tại Twitter, và được phát hành giống như một sản phẩm nguồn mở vào tháng 8/2011 trên GitHub.
Đến tháng 6 năm 2014 thì Bootstrap chính là No.1 Project ở trên GitHub.
Bootstrap là gì?
Bootstrap là một front-end framework hoàn toàn miễn phí, giúp cho quá trình phát triển website được dễ dàng và tiện lợi hơn rất nhiều.
Hiện nay Bootstrap đã có rất nhiều mẫu thiết kế được dựa trên các ngôn ngữ lập trình trên HTML và CSS như typography, form, buttons, tables hay navigitations, modals hay images … cũng như có nhiều các plugin JavaScript tuỳ chọn khác nhau.
Tại Bootstrap cũng cung cấp cho người sử dụng khả năng tạo ra những bản responsive designs một cách dễ dàng.
Nếu bạn không biết responsive web thì chúng tôi cung cấp thêm cho bạn thông tin cơ bản như sau:
Responsive Web Design chính là 1 website có khả năng tự động điều chỉnh được kích thước để có thể hiển thị vừa vặn trên tất cả các thiết bị từ laptop, đến các thiết bị di động thông minh như điện loại, ipad …
Lý do bạn nên sử dụng Bootstrap
Rất dễ dàng sử dụng: Nếu như bạn có kiến thức cơ bản về các ngôn ngữ lập trình như HTML, CSS hay JavaScript thì bạn có thể bắt đầu và dễ dàng sử dụng Bootstrap rồi đó.
Nhiều tính năng đáp ứng (Responsive features): biểu mẫu responsive css của bootstrap có khả năng tự động điều chỉnh kích thước website cho điện thoại, máy tính để bàn hay máy tính bảng.
Tiếp cận Mobile-first: hiện nay ở trong phiên bản Bootstrap 3 thì Mobile-first-styles chính là 1 phần của core framework.
Khả năng tương thích nhiều trình duyệt: ưu điểm nổi bật của Bootstrap đó là nó giúp website của bạn có thể tương thích với rất nhiều trình duyệt hiện đại như: chrome, firefox, internet explorer hay safari và opera.
Cách để tải Bootstrap
Hiện nay có 2 cách để bạn có thể sử dụng được Bootstrap trên website như sau:
Cách 1: Dowload Bootstrap từ Getbootstrap.com
Sau khi bạn đã tải file source của Bootstrap trên trang chủ của Getbootstrap thì bạn thêm thẻ link, chỉ đường dẫn đến trực tiếp file bootstrap.css hoặc bootstrap.min.css ( Như mẫu ví dụ dưới đây ).
<link rel=”stylesheet” type=”text/css” href=”bootstrap/css/bootstrap.css”>
Sau đó bạn thêm thẻ script vào cuối thẻ body. ( Như mẫu ví dự ở dưới ).
<script type=”text/javascript” src=”bootstrap/js/bootstrap.js”></script>
Cách 2: Sử dụng Bootstrap qua CDN
Đối với cách 2 thì bạn không cần tải Bootstrap về mà bạn chỉ cần nhúng nó qua BootstrapCDN là được, ( Mẫu VD ở dưới ).
<!– Latest compiled and minified CSS –>
<link rel=”stylesheet” href=”//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css”>
<!– Optional theme –>
<link rel=”stylesheet” href=”//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap-theme.min.css”>
<!– Latest compiled and minified JavaScript –>
<script src=”//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js”></script>
Với cách 2 thì bạn không cần phải tải Bootstrap về, điều này sẽ giúp website của bạn được tải xuống nhanh hơn.
Một vài plugin hỗ trợ code bootstrap trong Sublime Text
Bạn có thể cài thêm 1 vài plugin ở trong phần mềm soạn thảo Sublime Text để có thể hỗ trợ viết code dễ dàng hơn.
Bước đầu tiên thì bạn cần phải cài package control.
Sau khi cài xong thì bạn cần cài thêm bootstrap autocomplete và bootstrap snipets vào preferences, sau đó chọn package control và nhập vào install package, sau đó tìm tên 2 plugin trên.
Một vài đường link học Bootstrap mà bạn cần lưu lại:
Cách sử dụng css tại: vietnamforestry.com.vn/css/
Thành phẩn của Bootstrap tại: vietnamforestry.com.vn/components
Cách sử dụng javascript của Bootstrap tại: vietnamforestry.com.vn/javascript
Hi vọng với những thông tin ở dưới đây sẽ giúp bạn hiểu về hơn Bootstrap là gì? cách tải Bootstrap về như thế nào. Chúc các bạn có những giờ học bổ ích, và đừng quên nếu vẫn còn thắc mắc về kiến thức bootstrap thì có thể để lại comment ở bài viết đưới đây, chúng tôi sẽ giúp bạn giải đáp thắc mắc trong thời gian sớm nhất.
