Chủ Nhật, 28 tháng 4, 2019

Bootstrap là gì? Những thông tin cơ bản về bootstrap bạn cần biết?

Bootstrap là một nền tảng (frameword) miễn phí, là mã nguồn mở được xây dựng dựa trên ngôn ngữ lập trình HTML, CSS và Javascript . Nó sẽ giúp cho nhà phát triển web có thể tạo ra những giao diện web phù hợp với màn hình điện thoại. Bạn có muốn tiếp tục khám phá những kiến thức thú vị từ Bootstrap? Hãy cùng Viknews Việt Nam tìm hiểu qua bài viết này nhé!

Sự ra đời của Bootstrap.

Tại thời điểm khi mà bootstrap chưa xuất hiện thì để một website có thể sử dụng cho cả người dùng máy tính hay điện thoại di động thì các nhà lập trình bắt buộc phải thiết kế 2 project khác nhau: Một bản dành cho người dùng máy tính hay máy tính bảng, bản kia sẽ dành cho các điện thoại hay các thiết bị có màn hình tương tự vậy. Chính điều này đã gây ra những khó khăn không hề nhỏ trong việc quản lý website bởi khi muốn thực hiện  thay đổi, nâng cấp hay bảo trì website thì đòi hỏi phải thực hiện trên cả 2 project khác nhau. Không chỉ như vậy mà 2 project này còn phải thực hiện trên 2 tên miền(domain) khác nhau. Dựa trên những ý tưởng này mà Bootstrap đã ra đời

[caption id="attachment_40916" align="alignnone" width="1024"]bootstrap-la-gi bootstrap là gì?[/caption]

Tại thời điểm khi mà bootstrap xuất hiện lần đầu vào thời gian ngày 19 tháng 01 năm 2011, trải qua nhiều lần update và chỉnh sửa bản gần đây nhất của bootstrap là phiên bản 4.0 được công bố vào ngày 19 tháng 01 năm 2018 (Sau đúng 7 năm kể từ phiên bản lần đầu tiên) được xem là bản hoàn thiện nhất và dễ sử dụng hơn rất nhiều so với những phiên bản trước đó.  

Ưu điểm của bootstrap.

Việc Bootstrap xuất hiện đã giải quyết được một trong những vấn đề lớn mà các nhà xây dựng website gặp phải, được xem là một phát minh tiên tiến trong lĩnh vực công nghệ nói chung và thiết kế website nói riêng. Vậy bootstrap có những ưu điểm nổi bật nào?

https://www.youtube.com/watch?v=fIxYFGAFXAQ

- Nó dễ dàng sử dụng, kể cả với những người chưa biết nhiều về việc xây dựng và thiết kế website, chỉ cần bạn có những hiểu biết cơ bản về html và css.

- Bootstrap sẽ tự động điều chỉnh kích thước trang web cho phù hợp với các loại màn hình khác nhau, đây có lẽ là ưu điểm lớn nhất của Bootstrap tạo được sự chú ý cho mọi người.

- Bootstrap tương thích với mọi loại trình duyệt khác nhau (Chrome, Firefox, Internet Explorer, Safari, and Opera). Nhưng cần lưu ý là với các phiên bản cũ của Internet Explorer(IE) như IE8 hay IE9 thì bootstrap sẽ không thể hỗ trợ được.

Làm thế nào để thêm bootstrap vào website

Vì bản chất của bootstrap là một mã nguồn mở nên bạn hoàn toàn có thể truy cập vào địa chỉ trang web: https://getbootstrap.com để tải về.

[caption id="attachment_40917" align="alignnone" width="1024"]bootstrap-trong-thiet-ke-website Bootstrap trong thiết kế website.[/caption]

Bên cạnh đó,  bạn có thể thêm bootstrap từ CND, bạn sẽ không mất nhiều thời gian tải lại các file mà dùng ngay vì nó có sẵn cơ chế cache trên máy chủ.

Việc thêm bootstrap vào website khá đơn giản phải không nào?

Một số lưu ý khi sử dụng bootstrap

Để có thể sử dụng bootstrap một cách hiệu quả nhất, bạn cần nắm rõ những kiến thức cũng như cách sử dụng nó, hãy lưu ý một số điểm dưới đây:

[caption id="attachment_40918" align="alignnone" width="1024"]uu-diem-bootstrap Lưu ý khi sử dụng bootstrap.[/caption]

- Class Container: Đây là thẻ bọc ngoài hầu hết tất cả các div về sau, vì nó đã được fix sẵn độ rộng cho từng độ phân giải cụ thể, bạn cần padding sang 2 bên 15px là phù hợp nhất.

- Class Row: Đây là thẻ margin số âm,  - 15px nếu như bạn cần thêm một thẻ nào đó vào sát thẻ này ở 2 bên. Nó ngược lại với Container, chỉ cần đặt thẻ này bọc ngoài thẻ Row là thẻ đó sẽ nằm trong đúng lề.

- Class container – fluid: Thẻ này có độ rộng full màn hình, bạn cần padding sang hai bên 15px, thẻ này cũng có điểm tương đồng với thẻ container, nó sẽ được sử dụng để bọc ngoài hầu hết tất cả các thẻ div về sau.

Trên đây là toàn bộ những kiến thức cần thiết nhất về bootstrap mà Viknews Việt Nam muốn chia sẻ với bạn. Hy vọng qua bài viết này sẽ giúp các bạn có được những cái nhìn ban đầu về bootstap cũng như tính năng của nó trong việc xây dựng website và hỗ trợ công việc của bạn tốt nhất. Cảm ơn bạn đã dành thời gian theo dõi bài viết.

Xem thêm: Ngôn ngữ HTML là gì? HTML đóng vai trò gì trong một website?

Tham khảo bài viết gốc ở : Bootstrap là gì? Những thông tin cơ bản về bootstrap bạn cần biết?



from Viknews.com - Feed http://bit.ly/2ZHZYkg
via IFTTT

Không có nhận xét nào:

Đăng nhận xét