Tổng hợp cách học bootstrap cơ bản với các định nghĩa Update 04/2024

Khi bạn muốn học bất kỳ kiến thức lập trình website gì thì bạn cũng cần phải am hiểu rõ các kiến thức có trong môn học đó. Bootstrap cũng vậy, để có thể sử dụng bootstrap hiệu quả thì đòi hỏi bạn phải biết rõ các định nghĩa trong bootstrap.

Bootstrap là gì?

Bootstrap chính là 1 framework của css và javascript, và nói một cách dễ hiểu thì bootstrap chính là những đoạn code được viết sẵn, và khi đó bạn chỉ cần sử dụng những class có trong bootstrap để tuỳ chỉnh thêm, khi đó công việc xậy dựng giao diện website sẽ trở lên nhanh chóng và dễ dàng nhất.

Bootstrap là gì?

Xem thêm: Bootstrap là gì?

Bootstrap container là gì?

Bootstrap container chính là 1 phần tử có thể chứa được nhiều phần tử khác, ví dụ như <div>, <span> … khi đó lớp .container hay .container-fluid sẽ được sử dụng cho các phần tử này.

Bootstrap Grid System là gì?

Bootstrap Grid System chính là 1 trong những định nghĩa, thành phần vô cùng quan trọng của Bootstrap, tác dụng của nó giúp bạn bố trí được các thành phần có trên giao diện, và giúp website của bạn có thể tương thích được với nhiều giao diện trên nhiều thiết bị khác nhau.

Grid System là gì?

Xem thêm: Grid System trong Bootstrap

Bootstrap NavBar là gì?

Bootstrap NavBar hay Navigation Bar – thanh điều hướng là 1 phần giao diện của giao diện người dùng, giúp cho người sử dụng có thể thấy và nhẩy đến các trang khác trong website.

Bootstrap Table là gì?

Table là 1 trong những thành phần được sử dụng vô cùng rộng rãi trong website. và để có thể tạo ra được 1 bảng theo phong cách Bootstrap thì bạn chỉ cần áp dụng lớp .table cho các thẻ (tag)<table> và kèm với 1 bài lớp bổ sung để có thể tạo ra được 1 bảng theo ý muốn của mình.

Với lớp .table cho <Table> thì bạn sẽ có thể tạo được 1 bảng cơ bản nhất theo phong cách của Bootstrap.

Bootstrap Modal là gì?

Bootstrap Modal là một hộp thoại(Dialog) hay một cửa sổ bật lên(popup), khi đó nó sẽ hiển thị phía trên tất cả các nội dung khác trên 1 page hiện tại. Mục đích của Bootstrap Modal là thông báo cho người dùng điều gì đó mà bạn đang muốn gửi đến khách hàng của mình.

Bootstrap Form là gì?

Bootstrap Form là thành phần các form được tạo ra trong giao diện website, tại đó bạn có thể điền được các thông tin quan trọng, tóm tắt mà bạn muốn người dùng nắm bắt được sớm nhất.

Vertical form

Với

  • Lớp .form-group: bố trí các phần tử theo phương thẳng đứng
  • Lớp .form-inline: bố trí các phần tử theo phương nằm ngang

Xem thêm: Form trong bootstrap

Bootstrap Input Group là gì?

Bootstrap Input Group là phương thức giúp bạn mở rộng một Input Control bằng phương pháp thêm vào bên cạnh nó các phần tử như Text, Button hay Button Group, và các phần tử được thêm vào bênh cạnh Input Control sẽ được gọi là các Addons.

Xem thêm: Input group trong Bootstrap

Bootstrap Pagination là gì?

Với 1 page có nhiều dữ liệu, thông tin, hay nó quá dài và lớn để có thể hiển thị trên 1 page duy nhất thì bạn cần phải chia nó ra làm nhiều phần, mỗi phần đó sẽ là 1 page và nó sẽ hiển thị 1 vài dữ liệu, thông tin, khi đó bạn sẽ cần đến 1 link để cho người dùng có thể click đến những trang tiếp đó. Những link đó chính là Bootstrap Pagination.

Bootstrap Badge là gì?

Bootstrap Badge là 1 thành phần giao diện nhỏ và được sử dụng để trang trí cho 1 thành phần nào đó.

Bootstrap Badge sẽ sử dụng lớp .badge áo dụng cho 1 thẻ tag để có thể tạo ra 1 Badge.

Một vài lớp bổ sung như .badge-primary, .badge-secondary, .badge-danger …

Bootstrap Jumbotron là gì?

Bootstrap Jumbotron chính là 1 thành phần giao diện có trong Bootstrap, tác dụng của nó để tạo ra 1 vùng hiển thị nội dung quan trọng nhất của page, giúp thu hút sự chú ý của người tiêu dùng.

Class Jumbotron trong Bootstrap

Bootstrap Dropdown là gì?

Bootstrap Dropdown cơ bản chính là 1 component và nó bao gồm 1 button, menu, và khi người dùng nhấn vào button thì menu sẽ xuất hiện và cho phép người dùng có thể lựa chọn giá trị từ 1 danh sách có sẵn

Xem thêm: Dropdow Menu for Bootstrap.

Bootstrap Alert là gì?

Bootstrap Alert chính là 1 thành phần giao diện đã được xây dựng sẵn trong Bootstrap, đây là 1 vùng không gian sẽ hiển thị 1 thông điệp như thông tin, cảnh báo lỗi …

Hi vọng với những thông tin ở trên về cách học bootstrap cơ bản với các định nghĩa có trong bootstrap sẽ giúp bạn có thêm kiến thức bootstrap nhé. Chúc các bạn thành công.