Hướng dẫn which css framework should i learn in 2022? - Tôi nên học framework css nào vào năm 2022?

Tìm kiếm các khung CSS tốt nhất vào năm 2022? Vâng, ở đây chúng tôi đã liệt kê một số khung CSS có xu hướng tốt nhất để bạn có thể nhận được một cái nhìn tổng quan chi tiết về các khung CSS khác nhau cùng một lúc !!🧐 Well, here we have listed down some of the best trending CSS frameworks so that you can get a detailed overview of various CSS frameworks at once…!!

Như chúng ta đều biết rằng Framework CSS là một thư viện mã trừu tượng hóa các thiết kế web phổ biến và giúp nhà phát triển thiết kế dễ dàng thực hiện trong các ứng dụng web của họ. Nói một cách đơn giản, Framework CSS là một tập hợp các kiểu kiểu CSS được chuẩn bị sẵn và sẵn sàng để sử dụng.

Tại sao sử dụng Frameworks CSS?
  • Tăng tốc độ phát triển của bạn
  • Cho phép chức năng trình duyệt chéo
  • Thực thi thói quen thiết kế web tốt
  • Cung cấp cho bạn các bố cục sạch sẽ và đối xứng
  • Họ làm cho quy trình tạo kiểu của bạn hiệu quả, sạch sẽ và có thể bảo trì

Bên cạnh đó, chúng có cấu trúc để sử dụng trong các tình huống phổ biến, như thiết lập NAVBARS và thường được khuếch đại bởi các công nghệ khác như SASS và JavaScript. Ưu điểm chính của khung CSS thích hợp là, nó tiết kiệm thời gian của bạn vì bạn không cần phải bắt đầu từ đầu.

Có nhiều khung CSS có sẵn, và tất nhiên, thật khó để tìm kiếm khung CSS phù hợp ở đây và ở đó. Vì vậy, chúng tôi đã chuẩn bị danh sách các khung CSS tốt nhất 2021 này, điều này sẽ giúp bạn có được cái nhìn tổng quan về các khung CSS cụ thể.

Với bất kỳ khung nào trong số này được đề cập trong danh sách dưới đây; Bạn sẽ được trang bị đầy đủ để xây dựng các dự án sạch, có thể bảo trì với đầu tư thời gian tối thiểu.

Khung CSS tốt nhất vào năm 2022

Danh sách này được chuẩn bị cẩn thận đề cập đến các nguồn đáng tin cậy sau:

  • GitHub
  • Slant.co
  • Stackoverflow
  • Stackshare
  • Gói
  • Buitwith

1. Tailwind CSS: Mức độ thấp, khung đầu tiên tiện ích

Hướng dẫn which css framework should i learn in 2022? - Tôi nên học framework css nào vào năm 2022?

Tailwind CSS là một khung CSS đầu tiên có khả năng tiện ích thấp, có thể tùy chỉnh cao, cung cấp cho bạn tất cả các khối xây dựng bạn cần để xây dựng các thiết kế bespoke mà không có bất kỳ phong cách quan điểm khó chịu nào mà bạn phải chiến đấu để ghi đè. Không giống như các khung CSS khác (bootstrap hoặc vật chất hóa CSS), nó không đi kèm với các thành phần được xác định trước. Thay vào đó, nó hoạt động ở cấp độ thấp hơn và cung cấp cho bạn một bộ các lớp trợ giúp CSS. Bằng cách sử dụng các lớp này, bạn có thể nhanh chóng tạo thiết kế tùy chỉnh một cách dễ dàng. Tailwind CSS cho phép bạn tạo thiết kế độc đáo của riêng bạn. is a highly customizable, low-level utility first CSS framework that gives you all of the building blocks you need to build bespoke designs without any annoying opinionated styles you have to fight to override. Unlike other CSS frameworks (Bootstrap or Materialize CSS) it doesn’t come with predefined components. Instead, it operates on a lower level and offers you a set of CSS helper classes. By using these classes you can rapidly create custom design easily. Tailwind CSS lets you create your own unique design.

Bạn có thể kiểm tra trang Github Tailwind.

Lý do để sử dụng đuôi:

  • Không có chủ đề mặc định
  • Không áp đặt các quyết định thiết kế mà bạn phải chiến đấu để hoàn tác
  • Cung cấp một khởi đầu thực hiện một thiết kế tùy chỉnh với bản sắc riêng của nó
  • Đi kèm với một menu các tiện ích được thiết kế trước để xây dựng trang web của bạn với

Hướng dẫn which css framework should i learn in 2022? - Tôi nên học framework css nào vào năm 2022?

Một số thông tin bổ sung:

  • Ngày phát hành: ngày 2 tháng 11 năm 2017 November 2, 2017
  • Git Star, Fork, Người đóng góp: 27,1k, 1,3k, 255 27.1k, 1.3k, 255
  • Tin tức tin tức, Reddit, Stack Overflow: H, 245.525 245,525
  • Giấy phép: MIT MIT
  • Số trang web: 11.671 11,671
  • Tài liệu: Tốt Good
  • Khái niệm cốt lõi: Tiện ích đầu tiên, đáp ứng Utility first, responsive
  • Lưới: Flexbox Flexbox
  • Hỗ trợ trình duyệt: Tất cả trình duyệt hiện đại All modern browser
  • Các công ty sử dụng: Setel, Livestorm, Mogic, tuyên bố: Setel, Livestorm, Mogic, Declik

2. Bootstrap: Khung phổ biến nhất thế giới

Hướng dẫn which css framework should i learn in 2022? - Tôi nên học framework css nào vào năm 2022?

Bootstrap là khung CSS tốt nhất thế giới với sự hỗ trợ của cộng đồng lớn. Khung này được xây dựng trong HTML, SASS và JavaScript. Hiện tại, Bootstrap 4.5.0 là phiên bản mới nhất có khả năng đáp ứng nhiều hơn với các lớp tiện ích và các thành phần mới. Nó được hướng vào sự phát triển mặt trước của thiết bị đầu tiên, đáp ứng, giúp nó có thể sử dụng được cho bất kỳ thiết bị và nhà phát triển thân thiện nào. Bootstrap hỗ trợ tất cả các trình duyệt hiện đại. Ưu điểm tốt nhất của Bootstrap là, khung này có các thành phần JavaScript tuyệt vời với các tệp tùy chỉnh hoặc CDN. is the world’s best CSS framework with large community support. This framework is built in HTML, SASS, and JavaScript. Currently, Bootstrap 4.5.0 is the latest version with more responsiveness with utility classes and new components. It is directed at the responsive, mobile-first front end development which makes it usable for any device and developer-friendly. Bootstrap supports all modern browsers. The best advantage of bootstrap is, this framework has great JavaScript components with custom files or CDN.

Bootstrap 5 Alpha đã đến, nếu bạn muốn biết thêm về nó, bạn có thể kiểm tra bài viết trên Bootstrap 5 Alpha đã đến những gì mới và những điều bạn cần biết về nó.

Bạn cũng có thể kiểm tra mẫu quản trị viên bootstrap 5 html dựa trên bootstrap Mẫu quản trị bootstrap tốt nhất không chỉ dễ sử dụng, mà còn có khả năng mở rộng cao.Sneat Bootstrap 5 HTML Admin template.It is the latest most developer-friendly 🤘🏻 & highly customizable✨ Admin Dashboard Template based on Bootstrap 5. Besides, the highest industry standards are considered to bring you the best bootstrap admin template that is not just fast🚀and easy to use, but highly scalable.

Hướng dẫn which css framework should i learn in 2022? - Tôi nên học framework css nào vào năm 2022?

Hơn nữa, bạn có thể sử dụng một trong những mẫu quản trị viên bootstrap sáng tạo tốt nhất để tạo các ứng dụng web bắt mắt, chất lượng cao và hiệu suất cao. Bên cạnh đó, các ứng dụng của bạn sẽ hoàn toàn đáp ứng, đảm bảo chúng trông tuyệt đẹp và hoạt động hoàn hảo trên máy tính để bàn, máy tính bảng và thiết bị di động.Bootstrap admin templates to create eye-catching, high-quality, and high-performing Web Applications. Besides, your apps will be completely responsive, ensuring they’ll look stunning and function flawlessly on desktops, tablets, and mobile devices.

Features:

  • Dựa trên bootstrap 5Bootstrap 5
  • Bố cục dọc & ngang layouts
  • Các chủ đề mặc định, biên giới & bán sáng
  • Hỗ trợ chế độ sáng và tối mode support
  • Quốc tế hóa/I18N & RTL đã sẵn sàng
  • Trình tạo bố cục
  • Cấu hình chủ đề: Tùy chỉnh mẫu của chúng tôi mà không đổ mồ hôi.
  • Sass cung cấp năng lượng
  • Bố cục đáp ứng đầy đủ
  • Mã sạch và nhận xét
  • Tài liệu tốt
  • Tận hưởng sự hỗ trợ không rắc rối

Tải xuống bản demo

Cũng có sẵn trong phiên bản bảng điều khiển React

Hướng dẫn which css framework should i learn in 2022? - Tôi nên học framework css nào vào năm 2022?

Lý do để sử dụng bootstrap:

  • Bootstrap cung cấp rất nhiều ví dụ và bố cục sẵn để bạn bắt đầu.
  • Với Bootstrap, các nhà phát triển có thể dễ dàng ghép các thành phần khác nhau lại với nhau và bố trí để tạo ra một thiết kế trang mới và ấn tượng.
  • Nhiều tài liệu chi tiết được cung cấp với các bố cục đó để người dùng có thể hiểu chúng một cách dễ dàng.
  • Bootstrap dựa trên giấy phép MIT, do đó, miễn phí sử dụng, miễn phí để phân phối, để bạn có thể phát triển và bạn cũng có thể đóng góp cho cộng đồng.
  • Bootstrap từ Github Trang GitHub bao gồm hơn 19.000 cam kết và 2000 người đóng góp.

Hướng dẫn which css framework should i learn in 2022? - Tôi nên học framework css nào vào năm 2022?

Một số thông tin bổ sung:

  • Ngày phát hành: ngày 19 tháng 8 năm 2011 August 19, 2011
  • Git Star, Fork, Người đóng góp: 144K, 70.2K, 2261 144k, 70.2k, 2261
  • Tin tức tin tức, reddit, stack Overflow: 3,3k, 9k, 98k 3.3k, 9k, 98k
  • Giấy phép: MIT MIT
  • Số trang web: 20.737.671 20,737,671
  • Tài liệu: Tuyệt vời Excellent
  • Tùy chỉnh: Tùy chỉnh GUI cơ bản (cần đặt giá trị màu theo cách thủ công) Basic GUI Customizer (need to put color values manually)
  • Khái niệm cốt lõi: RWD và di động đầu tiên RWD and mobile-first
  • Đường cong học tập: ôn hòa Mild
  • Grid: Flexbox dựa trên tối đa 12 cột Flexbox-based up to 12 column
  • Hỗ trợ trình duyệt: Chrome mới nhất, Safari, Firefox, Opera, Safari, Edge & IE 10+, Android V5.0+ Latest Chrome, Safari, Firefox, Opera, Safari, Edge & IE 10+, Android v5.0+
  • Các công ty sử dụng: Spotify, Coursera, Vine, Twitter, Walmart, và nhiều hơn nữa: Spotify, Coursera, Vine, Twitter, Walmart, and many more

Lý tưởng cho:

  • Một người mới bắt đầu mới sử dụng CSS, vì anh ta hoặc cô ta có thể khởi động Bootstrap mà không có bất kỳ trở ngại nào.
  • Một nhà phát triển có ít kiến ​​thức về JavaScript, người vẫn có thể sử dụng các thành phần Bootstrap mà không cần viết một dòng trong JS.
  • Một nhà phát triển back-end muốn thực hiện một số thay đổi UI ngay cả khi anh ấy hoặc cô ấy mới sử dụng cả HTML và CSS.

3. Vật chất hóa CSS: Khung CSS dựa trên thiết kế vật liệu

Hướng dẫn which css framework should i learn in 2022? - Tôi nên học framework css nào vào năm 2022?

Mật vật CSS là một khung phía trước đáp ứng dựa trên thiết kế vật liệu với các bộ sưu tập các thành phần UI với các hiệu ứng tối thiểu mà người dùng có thể dễ dàng thu hút. Vật chất hóa hoàn toàn đáp ứng trong máy tính bảng và thiết bị di động. Nó rất dễ học cũng như tài liệu tuyệt vời được cung cấp. Khung này có hỗ trợ cộng đồng lớn và phản hồi tích cực tuyệt vời. Mật vật CSS cho phép bạn tùy chỉnh các tùy chọn với một bộ sưu tập màu ấn tượng. is a responsive front-end framework based on the material design with collections of UI-components with minimal effects on which users can easily attract. Materialize is fully responsive in Tablets and mobile. It is easy to learn as well as excellent documentation is provided. This framework has large community support and great positive feedback. Materialize CSS allows you to customize options with an impressive set of color collections.

Các mẫu quản trị vật chất dựa trên khung CSS hiện vật được sử dụng rất nhiều trên thế giới do khả năng đáp ứng của nó.

Nếu bạn đang tìm kiếm một số mẫu quản trị viên/ bootstrap miễn phí dựa trên thiết kế vật liệu, thì bạn có thể kiểm tra mẫu quản trị vật chất.materialize admin template.

Lý do sử dụng CSS thành hiện thực:

  • Trang tài liệu của Metericize rất toàn diện và khá dễ bắt đầu.
  • Mật vật Github liệt kê hơn 3.800 cam kết và 500 người đóng góp.
  • Trang thành phần của vật chất bao gồm thẻ, nút, điều hướng và nhiều tính năng được thêm vào.

Hướng dẫn which css framework should i learn in 2022? - Tôi nên học framework css nào vào năm 2022?

Một số thông tin bổ sung:

  • Ngày phát hành: ngày 19 tháng 8 năm 2011 September 2011
  • Git Star, Fork, Người đóng góp: 144K, 70.2K, 2261 38k, 4.9k, 515
  • Tin tức tin tức, reddit, stack Overflow: 3,3k, 9k, 98k: 374, 3.2k
  • Giấy phép: MIT MIT
  • Số trang web: 20.737.671 111,481
  • Tài liệu: Tuyệt vời Good
  • Tùy chỉnh: Tùy chỉnh GUI cơ bản (cần đặt giá trị màu theo cách thủ công) Basic GUI Customizer
  • Khái niệm cốt lõi: RWD và di động đầu tiên RWD,mobile-first, semantic
  • Đường cong học tập: ôn hòa XY 12- Column grid,Floted (flexbox in latest version)
  • Grid: Flexbox dựa trên tối đa 12 cột Chrome 35+, Firefox 31+, Safari 9+, Opera, Edge, IE 11+
  • Hỗ trợ trình duyệt: Chrome mới nhất, Safari, Firefox, Opera, Safari, Edge & IE 10+, Android V5.0+ Avhana Health, Mid Day, Architonic, and many more

Các công ty sử dụng: Spotify, Coursera, Vine, Twitter, Walmart, và nhiều hơn nữa

  • Lý tưởng cho:

Một người mới bắt đầu mới sử dụng CSS, vì anh ta hoặc cô ta có thể khởi động Bootstrap mà không có bất kỳ trở ngại nào.

Hướng dẫn which css framework should i learn in 2022? - Tôi nên học framework css nào vào năm 2022?

Một nhà phát triển có ít kiến ​​thức về JavaScript, người vẫn có thể sử dụng các thành phần Bootstrap mà không cần viết một dòng trong JS. is a UI component library created with CSS, HTML, and JavaScript. It lets you add a Material Design look and feel to your websites. Besides, It doesn’t rely on any JavaScript frameworks and aims to optimize for cross-device use, gracefully degrade in older browsers, and offer an experience that is immediately accessible. You can use the components to construct attractive, consistent, and functional web pages and web apps. Pages developed with MDL will be able to support all the modern web design principles like browser portability, graceful degradation, and device independence.

Một nhà phát triển back-end muốn thực hiện một số thay đổi UI ngay cả khi anh ấy hoặc cô ấy mới sử dụng cả HTML và CSS.

3. Vật chất hóa CSS: Khung CSS dựa trên thiết kế vật liệu

Mật vật CSS là một khung phía trước đáp ứng dựa trên thiết kế vật liệu với các bộ sưu tập các thành phần UI với các hiệu ứng tối thiểu mà người dùng có thể dễ dàng thu hút. Vật chất hóa hoàn toàn đáp ứng trong máy tính bảng và thiết bị di động. Nó rất dễ học cũng như tài liệu tuyệt vời được cung cấp. Khung này có hỗ trợ cộng đồng lớn và phản hồi tích cực tuyệt vời. Mật vật CSS cho phép bạn tùy chỉnh các tùy chọn với một bộ sưu tập màu ấn tượng.

  • Các mẫu quản trị vật chất dựa trên khung CSS hiện vật được sử dụng rất nhiều trên thế giới do khả năng đáp ứng của nó.
  • Nếu bạn đang tìm kiếm một số mẫu quản trị viên/ bootstrap miễn phí dựa trên thiết kế vật liệu, thì bạn có thể kiểm tra mẫu quản trị vật chất.
  • Lý do sử dụng CSS thành hiện thực:
  • Với các mẫu viết blog của họ, thiết kế vật liệu Lite cho phép bạn bắt đầu blog trong vài phút.
  • MDL cung cấp một bộ thành phần phong phú, bao gồm các nút thiết kế vật liệu, trường văn bản, công cụ, người quay, và nhiều thành phần khác.

Hướng dẫn which css framework should i learn in 2022? - Tôi nên học framework css nào vào năm 2022?

Một số thông tin bổ sung:

  • Ngày phát hành: ngày 19 tháng 6 năm 2014 June 19, 2014
  • Git Star, Fork, Người đóng góp: 31,7K, 5,3k, 345 31.7k, 5.3k, 345
  • Tin tức tin tức, Reddit, Stack Overflow: H, 197, 648 h, 197, 648
  • Giấy phép: Apache-2
  • Số trang web: 74,521 74,521
  • Tài liệu: Tốt Good
  • Khái niệm cốt lõi: Sử dụng thiết bị chéo Cross-device use
  • Đường cong học tập: vừa phải Moderate
  • Lưới: 12: Máy tính để bàn: 12 máy tính để bàn, 8- máy tính bảng, 4- điện thoại 12 desktop, 8- tablet, 4- phone
  • Hỗ trợ trình duyệt: IE9, IE10, IE11, Chrome, Opera, Firefox, Safari, Chrome (Android), Mobile Safari IE9, IE10, IE11, Chrome, Opera, Firefox, Safari, Chrome (Android), Mobile Safari
  • Các công ty sử dụng: Google Wallet, Google Project Sunproof, nói chuyện tại Google.: Google wallet, Google Project Sunproof, Talks at Google.

Lý tưởng cho:

  • Đối với tất cả mọi người, những người muốn viết các trang web hiệu quả hơn, di động và quan trọng nhất là MDL về cơ bản làm cho khái niệm này có thể truy cập được một cách trơn tru và dễ dàng.

5. Bulma: Khung CSS miễn phí, nguồn mở

Hướng dẫn which css framework should i learn in 2022? - Tôi nên học framework css nào vào năm 2022?

Bulma là một khung CSS hiện đại đáp ứng. Khung này được tích hợp trong HTML, SASS CSS Prospector và CSS Flexbox. Bulma cung cấp rất nhiều tùy chọn để tùy chỉnh với các yêu cầu của bạn bằng các tệp SASS, gói web và biến. Bulma được tạo trong CSS thuần túy., Có nghĩa là trong khi sử dụng khung tất cả những gì bạn cần là một tệp .CSS và không .js. is a responsive modern CSS framework. This framework is built-in HTML, SASS CSS prospector, and CSS flexbox. Bulma gives lots of options to customize with your requirements using sass files, web packs, and variables. Bulma is created in pure CSS., which means while using the framework all you need is one .css file and no .js.

Khung này có một số tính năng rất tiên tiến giúp bạn làm cho trang web của bạn hấp dẫn hơn và ít mã hơn. Bạn có thể sử dụng các chức năng của tiện ích để tạo các mẫu màu tối và sáng. Nó có cùng lưới như bootstrap. Bulma cho phép bạn thêm mô -đun SASS. Nó tương thích với cả phông chữ tuyệt vời 4 và phông chữ tuyệt vời 5 nhờ phần tử .icon.

Lý do sử dụng Bulma:

  • Bulma cung cấp các cài đặt trước sạch và đơn giản giúp bạn dễ dàng lựa chọn theo chủ đề mà nhà phát triển muốn khám phá.
  • Bulma cung cấp một số lượng lớn các thành phần web mà từ đó, người ta chỉ có thể chọn và sử dụng nó để thiết kế theo yêu cầu và sửa đổi.
  • Trang GitHub Bulma có nhiều hơn 1000 cam kết và 600 người đóng góp.

Hướng dẫn which css framework should i learn in 2022? - Tôi nên học framework css nào vào năm 2022?

Một số thông tin bổ sung:

  • Ngày phát hành: 24 tháng 1 năm 2016 January 24, 2016
  • Git Star, Fork, Người đóng góp: 41k, 3,5k, 655 41k, 3.5k, 655
  • Reddit, Stack Overflow: 1.2k, 581 1.2k, 581
  • Giấy phép: MIT MIT
  • Số trang web: 30.987 30,987
  • Tài liệu: Tốt Good
  • Khái niệm cốt lõi: Sử dụng thiết bị chéo Basic GUI Customizer
  • Đường cong học tập: vừa phải RWD, mobile-first, Modern free
  • Lưới: 12: Máy tính để bàn: 12 máy tính để bàn, 8- máy tính bảng, 4- điện thoại Simple building of column layout
  • Hỗ trợ trình duyệt: IE9, IE10, IE11, Chrome, Opera, Firefox, Safari, Chrome (Android), Mobile Safari: Latest Chrome, Edge, Firefox, Opera, Safari, IE 10+ (Partially supported)
  • Các công ty sử dụng: Google Wallet, Google Project Sunproof, nói chuyện tại Google. Dev Tube, Economist, Rubrik, and many more

Lý tưởng cho:

  • Đối với tất cả mọi người, những người muốn viết các trang web hiệu quả hơn, di động và quan trọng nhất là MDL về cơ bản làm cho khái niệm này có thể truy cập được một cách trơn tru và dễ dàng.

5. Bulma: Khung CSS miễn phí, nguồn mở

Hướng dẫn which css framework should i learn in 2022? - Tôi nên học framework css nào vào năm 2022?

Bulma là một khung CSS hiện đại đáp ứng. Khung này được tích hợp trong HTML, SASS CSS Prospector và CSS Flexbox. Bulma cung cấp rất nhiều tùy chọn để tùy chỉnh với các yêu cầu của bạn bằng các tệp SASS, gói web và biến. Bulma được tạo trong CSS thuần túy., Có nghĩa là trong khi sử dụng khung tất cả những gì bạn cần là một tệp .CSS và không .js. is an advanced frontend CSS framework, built-in HTML, CSS, SASS, and javascript. This framework has a sass compiler with a faster way to design a website. Foundation has its own CLI to install in your pc/Laptop using specific commands and you can easily watch. Similar same file structure like bootstrap Bulma and materialize CSS. This is a mobile-first approach CSS framework with fully responsive with components.

Khung này có một số tính năng rất tiên tiến giúp bạn làm cho trang web của bạn hấp dẫn hơn và ít mã hơn. Bạn có thể sử dụng các chức năng của tiện ích để tạo các mẫu màu tối và sáng. Nó có cùng lưới như bootstrap. Bulma cho phép bạn thêm mô -đun SASS. Nó tương thích với cả phông chữ tuyệt vời 4 và phông chữ tuyệt vời 5 nhờ phần tử .icon.

Lý do sử dụng Bulma:

  • Bulma cung cấp các cài đặt trước sạch và đơn giản giúp bạn dễ dàng lựa chọn theo chủ đề mà nhà phát triển muốn khám phá.
  • Bulma cung cấp một số lượng lớn các thành phần web mà từ đó, người ta chỉ có thể chọn và sử dụng nó để thiết kế theo yêu cầu và sửa đổi.
  • Trang GitHub Bulma có nhiều hơn 1000 cam kết và 600 người đóng góp.
  • Ngày phát hành: 24 tháng 1 năm 2016

Hướng dẫn which css framework should i learn in 2022? - Tôi nên học framework css nào vào năm 2022?

Một số thông tin bổ sung:

  • Git Star, Fork, Người đóng góp: 41k, 3,5k, 655 November 4, 2014
  • Reddit, Stack Overflow: 1.2k, 581 28.6k, 5.8k, 2045
  • Giấy phép: MIT 1.2k, 803
  • Giấy phép: MIT MIT
  • Số trang web: 30.987 441,292
  • Tài liệu: Tốt Good
  • Khái niệm cốt lõi: Sử dụng thiết bị chéo Advance GUI Customizer(for the previous version)
  • Đường cong học tập: vừa phải RWD and mobile-first
  • Lưới: 12: Máy tính để bàn: 12 máy tính để bàn, 8- máy tính bảng, 4- điện thoại Standard 12 column fluid responsive grid system
  • Hỗ trợ trình duyệt: IE9, IE10, IE11, Chrome, Opera, Firefox, Safari, Chrome (Android), Mobile Safari Last Two Versions of Chrome, Firefox, Safari, Opera, Mobile Safari, IE Mobile, Edge and IE 9+, Android Browser 4.4+
  • Các công ty sử dụng: Google Wallet, Google Project Sunproof, nói chuyện tại Google.: Amazon, Hp, Adobe, Mozilla, EA, Disney, and many more

Lý tưởng cho:

  • Đối với tất cả mọi người, những người muốn viết các trang web hiệu quả hơn, di động và quan trọng nhất là MDL về cơ bản làm cho khái niệm này có thể truy cập được một cách trơn tru và dễ dàng.

5. Bulma: Khung CSS miễn phí, nguồn mở

Hướng dẫn which css framework should i learn in 2022? - Tôi nên học framework css nào vào năm 2022?

Skeleton là một bộ sưu tập nhỏ các tệp CSS có thể giúp bạn phát triển nhanh chóng các trang web trông đẹp ở mọi kích thước, có thể là màn hình máy tính xách tay 17 ″ hoặc iPhone. Nó là một công cụ để phát triển nhanh chóng. Bạn có thể bắt đầu nhanh chóng với các thực tiễn tốt nhất của CSS, một lưới có cấu trúc tốt giúp việc xem xét di động dễ dàng, với cấu trúc tệp có tổ chức và các thành phần UI siêu cơ bản như các hình thức, nút, tab, tab, tab, và nhiều hơn nữa. is a small collection of CSS files that can help you rapidly develop sites that look beautiful at any size, be it a 17″ laptop screen or an iPhone. It is a tool for rapid development. You can get started fast with CSS best practices, a well-structured grid that makes mobile consideration easy, with an organized file structure, and super basic UI elements like lightly styled forms, buttons, tabs, and more.

Bạn có thể kiểm tra trang Skeleton Skeleton GitHub.

Lý do sử dụng Skelton:

  • Nhẹ
  • Lưới phản ứng
  • Vanilla CSS
  • Truy vấn phương tiện truyền thông

Hướng dẫn which css framework should i learn in 2022? - Tôi nên học framework css nào vào năm 2022?

Một số thông tin bổ sung:

  • Ngày phát hành: 15 tháng 5 năm 2020 May 15, 2020
  • Git Star, Fork, Người đóng góp: 17,8k, 3K, 41 17.8k, 3k, 41
  • Tin tức tin tức, reddit, stack tràn: 1.1k, 799, s 1.1k, 799, s
  • Giấy phép: MIT MIT
  • Khái niệm cốt lõi: RWD và di động đầu tiên RWD and mobile-first
  • Lưới: Lưới chất lỏng 12 cột 12-column fluid grid
  • Hỗ trợ trình duyệt: Chrome mới nhất, Firefox mới nhất, Opera Mới nhất, Safari mới nhất, tức là Lates Chrome latest, Firefox latest, Opera latest, Safari latest, IE lates
  • Các công ty sử dụng::

Lý tưởng cho:

  • Người ăn xin, vì nó là khung đơn giản nhất

8. Semantic UI: Trao quyền cho các nhà thiết kế và nhà phát triển bằng cách tạo từ vựng chung cho UI

Hướng dẫn which css framework should i learn in 2022? - Tôi nên học framework css nào vào năm 2022?

Semantic UI được xây dựng xung quanh mục tiêu độc đáo là tạo ra một từ vựng được chia sẻ xung quanh UI. Dựa trên các nguyên tắc ngôn ngữ tự nhiên, ngữ nghĩa trao quyền cho các nhà thiết kế và nhà phát triển bằng cách làm cho mã dễ hiểu hơn và dễ hiểu hơn. Người dùng nói UI Semantic rất dễ làm việc và chỉ có ý nghĩa. is built around the unique goal of creating a shared vocabulary around UI. Based on natural language principles, Semantic empowers designers and developers by making the code more readable and easier to understand. Users say Semantic UI is easy to work with and just makes sense.

UI ngữ nghĩa nổi bật với chức năng vượt ra ngoài khung CSS và bao gồm gỡ lỗi đơn giản hóa và khả năng xác định các yếu tố, bộ sưu tập, chế độ xem, mô -đun và hành vi của các yếu tố UI.

Bạn có thể kiểm tra trang GitHub Semantic.

Lý do sử dụng UI ngữ nghĩa:

  • Semantic UI cung cấp tài liệu được tổ chức rất tốt. Hơn nữa, khung có một trang web riêng với các hướng dẫn để bắt đầu, tùy chỉnh và tạo chủ đề.
  • Tất cả các lớp UI ngữ nghĩa là các từ của con người và mã hóa giống như viết một văn bản thông thường. Cách tiếp cận thân thiện với người dùng này giúp bạn dễ dàng nắm bắt và hiểu khung ngay cả đối với người mới bắt đầu.

Hướng dẫn which css framework should i learn in 2022? - Tôi nên học framework css nào vào năm 2022?

Một số thông tin bổ sung:

  • Ngày phát hành: ngày 26 tháng 9 năm 2013 September 26, 2013
  • Git Star, Fork, Người đóng góp: 48,4K, 5.1k, 391 48.4k, 5.1k, 391
  • Tin tức tin tức, reddit, stack Overflow: 1,5K, 897, 2,6K 1.5k, 897, 2.6k
  • Giấy phép: MIT MIT
  • Khái niệm cốt lõi: RWD và di động đầu tiên 124,579
  • Lưới: Lưới chất lỏng 12 cột Good
  • Hỗ trợ trình duyệt: Chrome mới nhất, Firefox mới nhất, Opera Mới nhất, Safari mới nhất, tức là Lates Semantic tag, Ambivalence, Responsive
  • Các công ty sử dụng: Mild
  • Lý tưởng cho: Default theme: 16 columns
  • Người ăn xin, vì nó là khung đơn giản nhất Last 2 Versions FF, Chrome, Safari Mac, IE 11+, Android 4.4+, Chrome for Android 44+, iOS Safari 7+, Microsoft Edge 12+
  • 8. Semantic UI: Trao quyền cho các nhà thiết kế và nhà phát triển bằng cách tạo từ vựng chung cho UI: Snapchat, ESPN, Avira Lingo.

Lý tưởng cho:

  • Người ăn xin, vì nó là khung đơn giản nhất

8. Semantic UI: Trao quyền cho các nhà thiết kế và nhà phát triển bằng cách tạo từ vựng chung cho UI

Hướng dẫn which css framework should i learn in 2022? - Tôi nên học framework css nào vào năm 2022?

Semantic UI được xây dựng xung quanh mục tiêu độc đáo là tạo ra một từ vựng được chia sẻ xung quanh UI. Dựa trên các nguyên tắc ngôn ngữ tự nhiên, ngữ nghĩa trao quyền cho các nhà thiết kế và nhà phát triển bằng cách làm cho mã dễ hiểu hơn và dễ hiểu hơn. Người dùng nói UI Semantic rất dễ làm việc và chỉ có ý nghĩa. is a set of small, responsive CSS modules for all your needs. Pure’s size is incredibly small only 3.8 KB minified. Besides, if you choose to only use a subset of available modules, you’ll save even more bandwidth. It is built on Normalize.css, Pure provides layout and styling for native HTML elements, plus the most common UI components. Its minimal styles encourage you to write your application styles on top of it.

UI ngữ nghĩa nổi bật với chức năng vượt ra ngoài khung CSS và bao gồm gỡ lỗi đơn giản hóa và khả năng xác định các yếu tố, bộ sưu tập, chế độ xem, mô -đun và hành vi của các yếu tố UI.

Bạn có thể kiểm tra trang GitHub Semantic.

  • Lý do sử dụng UI ngữ nghĩa:
  • Semantic UI cung cấp tài liệu được tổ chức rất tốt. Hơn nữa, khung có một trang web riêng với các hướng dẫn để bắt đầu, tùy chỉnh và tạo chủ đề.

Hướng dẫn which css framework should i learn in 2022? - Tôi nên học framework css nào vào năm 2022?

Một số thông tin bổ sung:

  • Ngày phát hành: ngày 26 tháng 9 năm 2013 May 15, 2013
  • Git Star, Fork, Người đóng góp: 48,4K, 5.1k, 391 21.1k, 2.2k, 105
  • Tin tức tin tức, reddit, stack Overflow: 1,5K, 897, 2,6K 825, 698,
  • Số trang web: 124.579 Yahoo
  • Tài liệu: Tốt 11,900
  • Lưới: Lưới chất lỏng 12 cột Good
  • Hỗ trợ trình duyệt: Chrome mới nhất, Firefox mới nhất, Opera Mới nhất, Safari mới nhất, tức là Lates SMACSS, Minimalism
  • Các công ty sử dụng: Mild
  • Lý tưởng cho: a 5ths 24ths unit based grid
  • Người ăn xin, vì nó là khung đơn giản nhất IE 10+, Latest Stable: Firefox, Chrome, Safari, iOS 12+, Android 6+
  • 8. Semantic UI: Trao quyền cho các nhà thiết kế và nhà phát triển bằng cách tạo từ vựng chung cho UI: Yahoo, LastPass, Flickr, CanYouSeeMe.org.

Lý tưởng cho:

  • Người ăn xin, vì nó là khung đơn giản nhất

8. Semantic UI: Trao quyền cho các nhà thiết kế và nhà phát triển bằng cách tạo từ vựng chung cho UI

Hướng dẫn which css framework should i learn in 2022? - Tôi nên học framework css nào vào năm 2022?

Semantic UI được xây dựng xung quanh mục tiêu độc đáo là tạo ra một từ vựng được chia sẻ xung quanh UI. Dựa trên các nguyên tắc ngôn ngữ tự nhiên, ngữ nghĩa trao quyền cho các nhà thiết kế và nhà phát triển bằng cách làm cho mã dễ hiểu hơn và dễ hiểu hơn. Người dùng nói UI Semantic rất dễ làm việc và chỉ có ý nghĩa. is a lightweight, modular front-end CSS, and web UI design framework, which offers almost all the major features of other frameworks. UI kits have lots of pre-built components such as Accordion, Alert, Drop, Iconnav, animations, Padding, etc. which shows usage patterns, component options, and methods.

UI ngữ nghĩa nổi bật với chức năng vượt ra ngoài khung CSS và bao gồm gỡ lỗi đơn giản hóa và khả năng xác định các yếu tố, bộ sưu tập, chế độ xem, mô -đun và hành vi của các yếu tố UI.

Bạn có thể kiểm tra trang GitHub Semantic.

Lý do sử dụng UI ngữ nghĩa:

  • Semantic UI cung cấp tài liệu được tổ chức rất tốt. Hơn nữa, khung có một trang web riêng với các hướng dẫn để bắt đầu, tùy chỉnh và tạo chủ đề.
  • Bộ UI có các thành phần được xây dựng trước như thả, cảnh báo, accordion, đệm, iconnav, hình ảnh động, v.v.
  • Nó giúp phát triển các giao diện web đáp ứng, mạnh mẽ và nhanh chóng. Nó bao gồm một bộ sưu tập toàn diện các thành phần CSS, HTML và JS.
  • UI Kit Github liệt kê hơn 4.000 cam kết.
  • Nó có thể mở rộng, đơn giản để tùy chỉnh và dễ sử dụng.

Hướng dẫn which css framework should i learn in 2022? - Tôi nên học framework css nào vào năm 2022?

Một số thông tin bổ sung:

  • Ngày phát hành: ngày 19 tháng 7 năm 2013 July 19, 2013
  • Git Star, Fork, Người đóng góp: 15,7k, 2,2k, 51 15.7k, 2.2k, 51
  • Tin tức tin tức, reddit, stack Overflow: 139, 21, 8.2k 139, 21, 8.2k
  • Giấy phép: MIT MIT
  • Số trang web: 311.897 311,897
  • Tài liệu: Tốt Good
  • Tùy chỉnh: Tùy chỉnh GUI cơ bản Basic GUI Customizer
  • Khái niệm cốt lõi: WebDesign đáp ứng, UX tập trung Responsive Webdesign, UX focused
  • Lưới: Lưới, Flex và Chiều rộng, đường viền giữa cột lưới Grid, flex and width, the border between grid column
  • Hỗ trợ trình duyệt: Chrome mới nhất, Firefox, Opera, Edge & Safari 9.1,+ IE 11+ Latest Chrome, Firefox, Opera, Edge & Safari 9.1,+ IE 11+
  • Công ty sử dụng: Crunchyroll, Litetube, Rover.com, và nhiều hơn nữa Crunchyroll, LiteTube, Rover.com, and many more

Lý tưởng cho:

  • Các nhà phát triển chuyên nghiệp và có kinh nghiệm cao vì thiếu tài nguyên học tập có sẵn.

CONCLUSION:-

Danh sách trên đưa ra một cái nhìn tổng quan chi tiết về khung tốt nhất năm 2021. Mỗi khung có các tính năng độc đáo và một loạt các thành phần giúp chúng thích hợp hơn cho các ứng dụng web của bạn. Bạn chắc chắn sẽ thấy bài viết này hữu ích và đáng chú ý, vì chúng tôi đã đề cập đến tất cả các khía cạnh chính của khung CSS.

Dưới đây là một số tham số bạn nên xem xét cho khung CSS phù hợp:

  • Bạn cần loại tiền xử lý trước CSS nào?
  • Sở thích thiết kế UI.
  • Hệ thống lưới điện
  • Giấy phép
  • Hỗ trợ trình duyệt
  • Phản ứng
  • Sự đóng góp cho cộng đồng

Mặc dù, bản thân bạn biết điều gì là tốt nhất cho bạn, vì vậy cuối cùng điều quan trọng là ý kiến ​​và lựa chọn của bạn. Vì vậy, chúng tôi hy vọng rằng bạn tìm thấy danh sách khung CSS tốt nhất này hữu ích và đáng chú ý. Sau khi trải qua nghiên cứu sâu sắc và đào sâu, chúng tôi đã thu thập được các khung CSS tuyệt vời, đáp ứng và rất được khuyến khích phù hợp cho dự án của bạn.

Hãy chia sẻ điều này với các đồng nghiệp, bạn bè và phương tiện truyền thông xã hội của bạn nhiều như bạn có thể quy kết. Bởi vì chia sẻ là chăm sóc… !! Đúng? 😇

Chúng tôi chắc chắn rằng sau khi đi qua danh sách các khung CSS tốt nhất 2022 này, bạn sẽ có thể chọn đúng theo yêu cầu của bạn.Best CSS Frameworks 2022 you’ll be able to choose the right one as per your requirement.

Nguồn:
  • https://tailwindcss.com/
  • https://getbootstrap.com/
  • https://bulma.io/
  • https://get.foundation/
  • https://getmdl.io/
  • http://getskeleton.com/
  • https://materializecss.com/
  • https://semantic-ui.com/
  • https://purecss.io/
  • http://getuikit.com/
  • https://github.com/
  • https://builtwith.com/a

Khung CSS nào tốt nhất vào năm 2022?

Khung CSS tốt nhất vào năm 2022..
Tailwind CSS ..
Khung Bulma CSS ..
Bootstrap..
Vật chất hóa CSS ..
Bộ UI ..
Milligram..

CSS vẫn được sử dụng vào năm 2022?

HTML và CSS là các ngôn ngữ mã hóa 'cũ' tương đối.Tuy nhiên, chúng vẫn rất phù hợp với các lập trình viên vào năm 2022. Kiến thức về HTML và CSS không chỉ giúp các lập trình viên chuyên nghiệp, mà còn giúp các cá nhân trong nhiều ngành nghề khác nhau bằng cách cung cấp cho họ kiến thức phát triển trang web cơ bản.they are still highly relevant for coders in 2022. Knowledge of HTML and CSS not only helps professional programmers, but also helps individuals in a variety of professions by giving them basic web page development knowledge.

Khung CSS tốt nhất để học là gì?

5 khung CSS hàng đầu cho các nhà phát triển và nhà thiết kế..
Bootstrap..
Tailwind CSS ..
Foundation..
Bulma..
Skeleton..

Phiên bản CSS nào là tốt nhất?

9 Khung CSS tốt nhất vào năm 2022..
Bootstrap.Tôi không thể nghĩ về một cuộc trò chuyện về các khung CSS sẽ không bao gồm bootstrap.....
Sự thành lập.Foundation là lựa chọn hoàn hảo cho các nhà phát triển có kinh nghiệm, những người thích tự do nhưng muốn sức mạnh của một khuôn khổ đầy đủ tính năng.....
Bulma.....
Tailwind CSS.....
Uikit.....
Miligam.....
Thuần khiết.....
Tachyons..