Hình thức bootstrap 5.1
Là web developer chắc chắn các bạn đã nghe hoặc sử dụng bootstrap rồi. Ở bài xin phép được chia sẻ cách cài đặt và sử dụng bootstrap trong ứng dụng Ruby on Rails. Tuy nhiên, đầu tiên mình sẽ giới thiệu về Bootstrap và lý do tại sao nó lại được nhiều nhà phát triển yêu thích đến vậy Show
Bootstrap là một framework cho phép thiết kế trang web đáp ứng nhanh hơn và dễ dàng hơn. Nó bao gồm các mẫu HTML, mẫu CSS và Javascript cho phép tạo các biểu mẫu và phần tử cơ bản như. 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. Trong bootstrap có thêm các plugin Javascript trong đó giúp cho công việc thiết kế reponsive của bạn dễ dàng hơn và nhanh chóng hơn Từ những lợi ích trên mà bootstrap được sử dụng rất nhiều trong các ứng dụng web ngày nay. Nó cho phép giảm thời gian xây dựng, thiết kế giao diện (nói dễ hiểu hơn là ví dụ như. ta muốn gắn một chiếc xe thì chỉ cần lựa chọn những phần thích hợp rồi gắn nhanh hoặc sửa đổi một chút chứ không cần phải làm từ đầu nhưn cái đinh, cái ốc )II. Cài đặt gem bootstrapĐầu tiên chúng ta khởi tạo dự án đường ray như sau. 4Vào Gemfile bổ sung thêm đá quý 5 như sau và đảm bảo rằng đã có đá quý 6 (mặc định đã được bổ sung khi khởi tạo dự án nếu ta không cần bổ sung thêm đá quý 6)Sau khi đã hoàn thành bước này, hãy chạy lệnh 0 và khởi động lại máy chủKiểm tra thấy dòng màu xanh đã cài đặt bootstrap-sass, như vậy là ta đã cài đặt xong, tiếp theo là đến bước config cho ứng dụng nhé Trước hết vào tệp 1 nhập kiểu Bootstrap bằng cách bổ sung 2 lệnh dưới đây
Lưu ý. 2 phải ở trên bootstrap, nếu bạn ngẫu hứng thay đổi thứ tự là mình không chịu trách nhiệm đâu ngheDefault file application has css đuôi ta cần chuyển nó thành đuôi scss
Sau đó xóa hết những dòng không cần thiết này nhé 3 4Chúng ta sẽ không còn sử dụng *= yêu cầu trong các bảng định kiểu tệp bởi vì nó sẽ không còn truy cập được Bootstrap mixins hay các biến Nếu các bạn đang sử dụng Rails 5. 1+ hãy thêm đá quý 5 (đừng quên câu lệnh thần thánh 0)Cuối cùng yêu cầu bootstrap vào ứng dụng tệp. js by add 2 command after
Như vậy là mình đã hướng dẫn các bạn cách cài đặt gem bootstrap, giờ chúng ta có thể vào đường dẫn sau Bootstrap Components lấy bất kỳ thành phần nào mong muốn hoặc sử dụng thư viện của bootstrap để làm cho giao diện của mình thật phổi Giới thiệu bootstrap là bài viết hướng dẫn sơ lược về boostrap như nhúng bootstrap vào trang, cách sử dụng vài thành phần cơ bản của bootstrap A. Giới thiệu về bootstrap
Ưu điểm của bootstrap
Phiên bản hiện tại của BootstrapHai phiên bản hiện đang phổ biến của thư viện Bootstrap là Bootstrap3 và Bootstrap 4 Phiên bảnNămMô tả1. 02011Phiên bản đầu tiên, không hỗ trợ Mobile. 2. 02012Bổ sung Grid-Layout 12 cột. Add some new component. Not support Mobile. 3. 02013Các thành phần được thiết kế lại theo phong cách thiết kế phẳng (thiết kế phẳng). Start support Mobile. 4. 02018Bootstrap 4 gần như được viết lại hoàn toàn từ Bootstrap 3 và được đánh giá là dễ sử dụng hơn rất nhiều so với phiên bản trước. 5. 02020Bootstrap 5 là phiên bản mới nhất của thư viện này, ra đời năm 2020. Bootstrap 5 không còn phụ thuộc vào jquery và không hỗ trợ các phiên bản cũ của IE nữaBootstrap 4 đã rất hay, thuyết phục được rất nhiều nhà phát triển. Bootstrap 5 còn tốt hơn, tối ưu về tốc độ tải, cải thiện bố cục tổ chức… mã gọn hơn rất nhiều Bootstrap tài nguyên websiteSau đây là các trang web để tải và lấy mã bootstrap mẫu a. Trang web chính thức của bootstrap |