03/08/2018, 09:50

Twitter Bootstrap la gi? Tìm hiểu Bootstrap CSS

Hiện nay PHP có rất nhiều Framework và CMS hỗ trợ giúp cho công việc lập trình trở nên đơn giản và thống nhất với nhau. Nhưng bạn có nghĩ trong ...

Hiện nay PHP có rất nhiều Framework và CMS hỗ trợ giúp cho công việc lập trình trở nên đơn giản và thống nhất với nhau. Nhưng bạn có nghĩ trong CSS cũng có những Framework như vậy hay không? Nếu bạn nghĩ không có thì bài này sẽ giúp bạn mở rộng tầm mắt đấy.

1. Twitter Bootstrap là gì?

Bootstrap là một Font-end Framework được viết bằng SASS và biên dịch thành CSS, nó là một bộ thư viện mạnh mẽ được 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 và dễ dàng hơn. Thông thường khi chúng ta lập trình bằng CSS thuần thì công việc kiểm tra tính tương thích trên các trình duyệt khác nhau và trên các thiết bị di động khác nhau  rất là khó khăn, nhưng với Bootstrap thì lập trình viên không cần phải tốn nhiều công sức nữa vì mọi thứ đã có người tạo nên Bootstrap lo.

Bootstrap chia layout của một trang web ra thành 960 Grid và gồm 12 cột, mỗi cột 80Grid và đây chính lả chuẩn thiết kế HTML & CSS của Bootstrap. Nó có hỗ trợ hầu hết các module của một trang web như menu, tabs, tooltip, popup, ... Ngoài ra nó còn sử dụng thêm Javascript để xử lý các hiệu ứng cấp cao, code javascript của nó sử dụng jquery nên để sử dụng được bắt buộc bạn phải bổ sung thêm thư viện jQuery nữa.

Hiện nay Version mới nhất là Version 4.0 và đang là phiên bản Beta, nhưng chỉ vài tháng nữa thôi nó sẽ được release.

2. Các lợi ích khi sử dụng Bootstrap

Qua phần Bootstrap là gì thì chắc hẳn bạn có thắc mắc tại sao lại nên sử dụng Bootstrap đúng không nào? Có nhiều lý do nhưng mình chỉ liệt kê một số lý do chính khuyên bạn nên sử dụng.

Phát riển giao diện nhanh chóng

Bạn dễ dàng phát riển giao diện website một cách rất nhanh, nếu một trang bình thường thì bạn có thể cắt xong trong một ngày hoặc chưa tới một ngày. Chưa kể đến tính tương thích với các trình duyệt và thiets bị di động

Dễ học, dễ sử dụng

Cộng đồng đông đúc và tài liệu tham khảo rõ ràng chính là sức mạnh của Bootstrap.

Javascrip

Hỗ trợ Javacript sử dụng jQuery, vì vậy bạn dễ dàng Custom làm theo ý của riêng mình mà không sợ bị đụng code JS.

SASS

Trước đây Bootstrap sử dụng LESS để xây dựng, tuy nhiện hiện nay Version mới nhất là 4.x người ta đã thay thế LESS bằng SASS nhằm mục đích tối ưu CSS và giúp cho nó hoạt động hiệu quả hơn.

Hỗ trợ SEO tốt

Đây là lý do quan trọng nhất bởi vì hiện nay Google đã cập nhật thuật toán tìm kiếm và Responsive là một yếu tố rất quan trọng để đưa từ khóa lên tóp.

3. Lời kết

Qua bài tìm hiểu Twitter Bootstrap là gì hy vọng sẽ giải đáp được thắc mắc của các bạn. Và mình cũng xin giới thiệu hiện nay trên website code24h.com có hai serie viết về Bootstrap và bạn có thể tham khảo tại:

  • Học Bootstrap 3
  • Học Bootstrap 4
BÀI KẾ SAU
BÀI KẾ TIẾP

Nguồn: code24h.com

0