Bootstrap là một khung để giúp bạn thiết kế các trang web nhanh hơn và dễ dàng hơn. Nó bao gồm các mẫu thiết kế dựa trên HTML và CSS cho kiểu chữ, biểu mẫu, nút, bảng, điều hướng, phương thức, băng chuyền hình ảnh, v.v ... Nó cũng cung cấp cho bạn hỗ trợ cho các plugin JavaScript. & nbsp; Show Để tìm hiểu về hoạt động bên trong của Bootstrap, tôi đã liên hệ với Stas Demchuk, kỹ sư phần mềm cao cấp tại: 8SPH.com. Ở đây, những gì bạn cần biết: 1. & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; Trước hết, Bootstrap là khung phổ biến nhất để tạo bố cục. Dưới đây là một số lý do bổ sung để sử dụng bootstrap:
2. Bootstrap có một cộng đồng lớn và hỗ trợ thân thiện. Đối với tài nguyên, hãy truy cập:
3. Bootstrap rất dễ thiết lập và tạo bố cục làm việc trong vòng chưa đầy một giờ Họ có một mẫu cơ bản có sẵn tại & nbsp; http: //getbootstrap.com/getting-started/#template và cũng là một tập hợp các ví dụ cho các nhu cầu khác nhau (http://getbootstrap.com/getting-started/#examples). Bạn chỉ có thể tải xuống kho lưu trữ Bootstrap, truy cập & nbsp; tài liệu/ví dụ & nbsp; thư mục, sao chép/dán ví dụ bạn cần và làm việc trên nó. 4. Bạn không cần biết rõ về HTML và CSS để sử dụng Bootstrap, đó là một điểm cộng nếu bạn là một nhà phát triển phụ trợ và cần thực hiện một số thay đổi UI. 5. Nó có thể tùy chỉnh hoàn toàn, tôi có thể chọn các thành phần nào tôi muốn sử dụng và sử dụng tệp các biến để có được tùy chỉnh hành vi và màu sắc hơn nữa. Tất cả những gì bạn cần làm là truy cập & nbsp; http: //getbootstrap.com/customize/, chọn các plugin bạn cần và nhấp vào & nbsp; tải xuống. Bootstrap cũng cung cấp một cách để ghi đè các biến nội bộ của nó cho người dùng nâng cao, nhưng chúng cung cấp mặc định khá tốt, vì vậy bạn không nên lo lắng về điều này trừ khi bạn cần.download. Bootstrap also provides a way to override its internal variables for advanced users, but they provide pretty decent defaults, so you shouldn’t worry about this unless you need to. 6. Khi bạn cập nhật phiên bản của Bootstrap, bạn đã giành được hàng tấn lỗi vì nhóm cốt lõi của họ quan tâm đến khả năng tương thích ngược. 7. Tài liệu của họ là tuyệt vời! Dưới đây là một số tài nguyên để kiểm tra:
8. Bootstrap cung cấp rất nhiều lớp trợ giúp giúp phát triển một trang web đáp ứng dễ dàng và nhanh chóng. Bạn có thể biến bất kỳ bố cục có chiều rộng cố định nào thành một chất lỏng bằng cách thay đổi cha mẹ & nbsp; .container & nbsp; class thành & nbsp;..container class to .container-fluid. Bootstrap cũng có & nbsp; Thí dụ:.visible-*-* classes to help you control the way your sections are displayed on tablets and mobile devices. Example: Trong trường hợp này, div sẽ được hiển thị dưới dạng phần với & nbsp; hiển thị: block & nbsp; chỉ trên điện thoại và máy tính bảng. Nó sẽ được ẩn trên máy tính để bàn.display: block only on phones and tablets. It will be hidden on desktop. 9. Các thành phần của Bootstrap, được chuyển sang hệ sinh thái của các khung MVC phổ biến như Angular. Bootstrap cung cấp một số cách để đưa nó vào dự án của bạn: Sử dụng Bower: Bower Cài đặt Bootstrap Sử dụng NPM: NPM Cài đặt Bootstrap Và chỉ cần thêm một thẻ tập lệnh với URL vào nguồn bootstrap trên CDN. Chúng tôi cũng có & nbsp; ui-bootstrap & nbsp; cho angular.js và & nbsp; React-bootstrap & nbsp; cho React. Bạn cũng có thể cài đặt chúng thông qua Bower và NPM. Và sau đó, ví dụ, để tạo ra một yếu tố sụp đổ, bạn chỉ cần tạo dấu hiệu tương tự:ui-bootstrap for Angular.js and react-bootstrap for React. You can also install them via Bower and npm. And then, for example, to create a collapse element, you just need to create similar markup: Trong trường hợp này, div sẽ được hiển thị dưới dạng phần với & nbsp; hiển thị: block & nbsp; chỉ trên điện thoại và máy tính bảng. Nó sẽ được ẩn trên máy tính để bàn. Trong trường hợp này, div sẽ được hiển thị dưới dạng phần với & nbsp; hiển thị: block & nbsp; chỉ trên điện thoại và máy tính bảng. Nó sẽ được ẩn trên máy tính để bàn. 9. Các thành phần của Bootstrap, được chuyển sang hệ sinh thái của các khung MVC phổ biến như Angular. Bootstrap cung cấp một số cách để đưa nó vào dự án của bạn: Sử dụng Bower: Bower Cài đặt Bootstrap Sử dụng NPM: NPM Cài đặt Bootstrap Và chỉ cần thêm một thẻ tập lệnh với URL vào nguồn bootstrap trên CDN. Chúng tôi cũng có & nbsp; ui-bootstrap & nbsp; cho angular.js và & nbsp; React-bootstrap & nbsp; cho React. Bạn cũng có thể cài đặt chúng thông qua Bower và NPM. Và sau đó, ví dụ, để tạo ra một yếu tố sụp đổ, bạn chỉ cần tạo dấu hiệu tương tự: Nội dung của sự sụp đổ Để biết thêm thông tin, hãy xem phần này về in. & NBSP; Trình duyệt cổ phiếu Android: Điên Android 4.1 (và một số bản phát hành mới hơn rõ ràng) với ứng dụng trình duyệt là trình duyệt web mặc định mà lựa chọn (trái ngược với Chrome). Thật không may, ứng dụng trình duyệt có rất nhiều lỗi và sự không nhất quán với CSS nói chung.“Android 4.1 (and some newer releases apparently) ship with the Browser app as the default web browser of choice (as opposed to Chrome). Unfortunately, the Browser app has lots of bugs and inconsistencies with CSS in general.” Kích thước hộp: Một số chương trình của bên thứ 3 như Google Maps và Google Custom Search Engine, tạo xung đột với Bootstrap. Điều này là do {Box-Sizing: Border-Box; }. Để đọc chuyên sâu, hãy xem trang bắt đầu tại GetBootStrap.com. Một lần nữa cảm ơn Stas Demchuk, kỹ sư phần mềm cao cấp tại: 8SPH.com. Tại sao Bootstrap tốt hơn HTML?Bootstrap là một nguồn mở miễn phí. Bootstrap là khung phổ biến nhất của HTML, CSS và JavaScript (JS) để tương thích với tất cả các trình duyệt hiện đại như Firefox, Chrome, Opera, Safari, Edge, v.v. Đây là cách phát triển web nhanh hơn và dễ dàng hơn. Bootstrap tạo ra các trang web độc lập với nền tảng.It is a faster and easier way of web development. Bootstrap creates platform-independent web pages.
Ưu điểm chính của bootstrap là gì?Lợi ích của việc sử dụng khung Bootstrap dễ dàng để ngăn chặn sự lặp lại giữa nhiều dự án.Thiết kế đáp ứng có thể được sử dụng để điều chỉnh kích thước màn hình và chọn những gì hiển thị và những gì không trên bất kỳ thiết bị nào.Duy trì tính nhất quán giữa các dự án khi sử dụng nhiều nhóm nhà phát triển.Thiết kế nhanh chóng của các nguyên mẫu.Easy to prevent repetitions among multiple projects. Responsive design that can be used to adapt screen sizes and choose what shows and what doesn't on any given device. Maintaining consistency among projects when using multiple developer teams. Quick design of prototypes.
Khi nào tôi nên sử dụng bootstrap?Tạo bố cục trang cần một lưới tốt.Bootstrap có lợi ích này: một trong những hệ thống lưới di động đáp ứng tốt nhất.Nó thực sự dễ sử dụng và nếu bạn cần làm việc thông qua các cột, thì bạn đang ở đúng nơi bằng cách sử dụng Bootstrap.Rất tiện dụng khi bạn muốn ẩn một số nội dung dựa trên kích thước màn hình. |
