Xây dựng giao diện responsive bằng framework Bootstrap

Thứ bảy - 26/07/2014 00:22
Bootstrap là một CSS Framework phổ biến nhất, nó sẽ giúp bạn xây dựng giao diện responsive nhanh nhất. Với rất nhiều lợi ích nó đã được tích hợp cho NukeViet 4.0
Sử dụng bootstrap xây dựng giao diện responsive trong NukeViet
Sử dụng bootstrap xây dựng giao diện responsive trong NukeViet

Bạn có thể đọc Responsive là gì ? Tìm hiểu để quyết định thiết kế web responsive để hiểu rõ hơn về responsive

 

Framework Bootstrap là gì?

Bootstrap là một CSS Framework phổ biến nhất hiện nay do Twitter phát triển. Vậy trước hết CSS Framework là gì? Hiểu theo từ framework thì nó là bộ công cụ giúp design trang web bằng css nhanh hơn. Nghĩa là là nó được trừu tượng hóa lên một mức cao hơn. Thay vì bạn phải hiểu rõ về các bộ chọn, các thuộc tính và giá trị trong CSS để style cho trang web của mình, thì bạn chỉ cần biết các thành phần có trên trang web như form, navbar, tooltip, dropdown-menu, modal, button,….. và add nó vào trang html của mình một cách thích hợp. Công việc còn lại là của Bootstrap.

Với kiến thức về HTML và sự hỗ trợ của Bootstrap như vậy một trang web đẹp mắt hoàn toàn nằm trong tầm tay dù bạn chưa học qua về CSS.

 

Ưu điểm của bootstrap:

 

  • Hỗ trợ khả năng Responsive: tức là trang web sẽ tự động co giãn theo kích thước của cửa sổ trình duyệt.
  • Tương thích tốt với thiết bị cỡ nhỏ: với sự phổ biến của smartphone hiện nay, đây là một yếu tố quan trọng. Không cần phải design một bản riêng cho mobile, với bootstrap bạn chỉ cần thiết kế một lần cho mọi thiết bị.
  • Được tích hợp với thư viện jQuery và tương tác tốt với chuẩn HTML5 và CSS3.

Ngoài ra Bootstrap còn được cập nhật phiên bản thường xuyên, hệ thống tài liệu hướng dẫn chi tiết, thân thiện với các công cụ tìm kiếm, tương thích trên nhiều trình duyệt, nhiều theme khác nhau (lên Google và gõ “Bootstrap themes“),….

Như vậy là bạn đã hiểu qua về Boostrap, để bắt đầu các bạn cần download nó : http://getbootstrap.com/

 

Video hướng dẫn học Boostrap:http://www.youtube.com/watch?v=guwfgOVbnZA&feature=youtu.be

 

Tổng số điểm của bài viết là: 40 trong 8 đánh giá

Xếp hạng: 5 - 8 phiếu bầu
Click để đánh giá bài viết

  Ý kiến bạn đọc

Bạn đã không sử dụng Site, Bấm vào đây để duy trì trạng thái đăng nhập. Thời gian chờ: 60 giây