12/08/2018, 13:51

10 CSS framework tốt nhất 2016 cho lập trình web

Nếu ví 1 website như một bức tranh thì html như khung tranh và những nét phác chính thì css đóng vai trò như màu vẽ, làm bức tranh ấy thêm sinh động hơn. Các bạn có thể dễ dàng nhận thấy ngày nay có quá nhiều framework css để giúp các bạn hoàn thiện website, tuy nhiên chỉ có một số lượng không ...

Nếu ví 1 website như một bức tranh thì html như khung tranh và những nét phác chính thì css đóng vai trò như màu vẽ, làm bức tranh ấy thêm sinh động hơn. Các bạn có thể dễ dàng nhận thấy ngày nay có quá nhiều framework css để giúp các bạn hoàn thiện website, tuy nhiên chỉ có một số lượng không nhiều thực sự xuất sắc và được ưa chuộng trên toàn thế giới.

Css framework là một bộ sưu tập các thành phần HTML, CSS, JS đã theo chuẩn có thể đem ra sử dụng mà không phải code lại từ đầu nhưng vẫn có thể tùy chỉnh lại theo ý mình. Mỗi css framework thì có những đặc trưng riêng mà tùy mục đích sử dụng chúng ta sẽ lựa chọn một framework cho phù hợp. Sau đây là danh sách 10 css framework bạn nên sử dụng:

1.Bootstrap

bootstrap.jpg

FrameWork cho smartphone phổ biến nhất. Bootstrap được sinh ra tại Twitter hồi đầu có tên là Twitter Bootstrap hiện nay là FrameWork số 01, dễ dùng phổ biến và đầy đủ. Đây là FrameWork bạn nên chọn vì được khá nhiều đơn đặt hàng từ các trang FreeLancer trên thế giới.

Các thông tin:

  • Phát hành: 2011
  • Popularity: 75,000+ sao trên GitHub
  • Kích thước: 145 KB
  • Preprocessors: Less và Sass.
  • Responsive: Có.
  • Modular: Có.
  • Sử dụng cho templates/Layout: Có.
  • Icon: Glyphicons Halflings.
  • Điểm đặc biệt: Jumbotron.
  • Hỗ trợ trình duyệt: Firefox, Chrome, Safari, IE8 + (bạn cần Respond.js cho IE8)
  • Trang chủ: http://getbootstrap.com/

2.Foundation

foundation-screen.png

Foundation là ứng viên thứ 2 ở trong danh sách này. Được hậu thuẫn bởi một công ty lớn như ZURB, framework này thực sự mạnh mẽ mà cũng thực sự giống với cái tên foundation (căn bản, nền tảng). Và như một điều tất yếu Foundation được sử dụng trên nhiều website lớn như Facebook, Mozilla, Ebay, Amazon, Yahoo! và National Geographic,…

Các thông tin:

  • Phát hành: 2011
  • Popularity: 18,000+ sao trên GitHub
  • Kích thước khung: 326 KB
  • Preprocessors: Sass
  • Responsive: Có.
  • Modular: Có.
  • Sử dụng cho templates/Layout: Có.
  • Icon: Foundation Icon Fonts
  • Mở rộng/Add-ons: Có.
  • Điểm đặc biệt: Icon Bar, Clearing Lightbox, Flex Video, Keystrokes, Joyride, Pricing Tables.
  • Hỗ trợ trình duyệt: Chrome, Firefox, Safari, IE9 +; iOS, Android, Windows Phone 7 +
  • Trang chủ: http://foundation.zurb.com/

3.HTML5 Boilerplate

HTML5-Boilerplate.png

HTML5 Boilerplate giúp bạn xây dựng App hoặc web nhanh, mạnh mẽ và đáp ứng hết các trình duyệt đây là theo giới thiệu tại trang chủ.

Các thông tin:

  • Alexa: 26,297
  • Pagerank: 7
  • Social Media: 41 634
  • Trang chủ: https://html5boilerplate.com/

4.Pure

pure.jpg

Pure là một framework khung có tính nhẹ nhàng – viết thuần css – bao gồm các thành phần có thể được sử dụng cùng nhau hoặc riêng tùy thuộc vào nhu cầu của bạn.

Các thông tin:

  • Phát hành: 2013
  • Popularity: 9,900+ sao trên GitHub
  • Kích thước: 18 KB
  • Preprocessors: Không.
  • Responsive: Có.
  • Modular: Có.
  • Sử dụng cho templates/Layout: Có.
  • Hỗ trợ trình duyệt: Firefox, Chrome, Safari; IE7 +; iOS 6.x, 7.x; Android 4.x
  • Trang chủ: http://purecss.io/

5.UI Kit

uikit-screen.png

UIKit là một bộ sưu tập ngắn gọn dễ sử dụng và dễ dàng tùy chỉnh các thành phần bên trong. Mặc dù nó không được là phổ biến như đối thủ cạnh tranh phía trên, tuy nhiên nó cung cấp các chức năng tương tự và thực sự chất lượng.

Các thông tin:

  • Phát hành: 2013
  • Popularity: 3,800+ sao trên GitHub
  • Kích thước: 118 KB
  • Preprocessors: Less, Sass.
  • Responsive: Có.
  • Modular: Có.
  • Sử dụng cho templates/Layout: Có.
  • Icon: Font Awesome.
  • Mở rộng: Có.
  • Điểm đặc biệt:Article, Flex, Cover, HTML Editor.
  • Hỗ trợ trình duyệt: Chrome, Firefox, Safari, IE9+
  • Trang chủ: http://getuikit.com/

6.Skeleton

skeleton.jpg

Skeleton là một css framework nhẹ, sử dụng hệ thống 12 cột, đó là điều mà Framework này có thể đánh bại các đối thủ khác, với đầy đủ các tính năng tượng tự như nhau.

Các thông tin:

  • Alexa: 45,638
  • Pagerank: 6/10
  • Social Media: 12 437
  • Trang chủ: http://getskeleton.com/

7.Base

base-2-1024x574.png

Base là một css framework đơn giản với cách tiếp cận trên di động trước. Nó là một giải pháp tốt để phát triển giao diện web trên di động hay máy ính bảng.

Các thông tin:

  • Trang chủ: http://getbase.org/

8.Materialize

materialize-1024x490.png

Được xây dụng bởi các đặc trưng của Google’s Material Design, Materialize là một framework responsive cho phát triển front-end vô cùng mạnh mẽ. Framework này rất thích hợp cho những ai muốn thi hành giao diện kiểu Material Design trên web của mình.

Các thông tin:

  • Trang chủ: http://materializecss.com/

9.Material UI

material-ui.png

Material UI là một framework khác thi hành các đặc trưng Material Design. Material UI được xây dựng trên thư viện React Javascript từ Facebook.

Các thông tin:

  • Trang chủ: http://www.material-ui.com/#/

10.Semantic UI

semanticui-screen.jpg

Semantic Ui là một sự nỗ lực không ngừng nghỉ để giúp cho việc xây dựng một website theo hướng semantic (ngữ nghĩa – tức tiện dụng cho người xây dựng khi sử dụng những thành phần của nó). Nó sử dụng các nguyên tắc ngôn ngữ tự nhiên từ đó giúp code dễ đọc và dễ hiểu hơn.

Các thông tin:

  • Phát hành: 2013
  • Kích thước khung: 552 KB
  • Preprocessors: Less
  • Responsive: Có.
  • Modular: Có.
  • Icon: Font Awesome
  • Điểm đặc biệt: Divider, Flag, Rail, Reveal, Step, Advertisement, Card, Feed, Item, Statistic, Dimmer, Rating, Shape.
  • Hỗ trợ trình duyệt: Firefox, Chrome, Safari, IE10 +, Android 4, Blackberry 10
  • Trang chủ: http://semantic-ui.com/

Tổng kết:

Như vậy có rất nhiều css framework có thể hỗ trợ chúng ta, quan trọng là phù hợp với nhu cầu của mình mà các bạn sẽ lựa chọn cho mình một css framework thích hợp.

Tham khảo:

http://imdev.vn/5-frontend-framework-pho-bien-nhat-cho-lap-trinh-web-nam-2015/

https://trogiup.net/5-css-framework-thiet-ke-web-mobile/

Bài liên quan

Laravel, framework số 1 trong danh sách 5 PHP framework tốt nhất 2017

PHP là một ngôn ngữ lập trình web miễn phí có độ phủ rộng nhất hiện nay để xây dựng các ứng dụng web phức tạp và hiệu quả. Danh sách những PHP framework tốt nhất năm 2017 bao gồm CakePHP, Laravel, CodeIgniter, Symfony và các framework khác. PHP là gì và tại sao người người, nhà nhà ...

Trần Trung Dũng viết 14:44 ngày 05/09/2018

5 ngôn ngữ lập trình tốt nhất dành cho phát triển AI

Bạn là một người có niềm đam mê với trí tuệ nhân tạo (AI – artificial intelligence) và đang phân vân không biết nên chọn ngôn ngữ lập trình nào cho dự án AI của mình? Vậy thì, trong khuôn khổ bài viết hôm nay, chúng tôi xin giới thiệu đến với các bạn top 5 ngôn ngữ lập trình hay nhất ...

Bùi Văn Nam viết 14:43 ngày 05/09/2018

Công cụ tìm kiếm tốt nhất cho lập trình viên

Thông thường, các newbie sẽ lướt trên Stackoverflow để tìm kiếm các chương trình mẫu hoặc cách implement các thuật toán khó. Tuy nhiên đó chưa phải là giải pháp nhanh nhất. Ít người để ý rằng Microsoft đã hợp tác với HackerRank để tích hợp code snippet vào Bing, biến nó thành ...

Hoàng Hải Đăng viết 23:14 ngày 04/09/2018

5 Trang web tốt nhất để học lập trình Python

Trong thập kỷ qua, ngôn ngữ lập trình Python đã trở nên cực kỳ phổ biến trong cộng đồng lập trình viên ở tất cả các lĩnh vực khác nhau. Từ các nhà phát triển web cho đến các tay thiết kế video game tới các nhà sáng tạo công cụ, nhiều người đã yêu mến ngôn ngữ này. Tại sao ư? Bởi vì nó ...

Hoàng Hải Đăng viết 22:07 ngày 02/09/2018

10 Java Web Framework tốt nhất của năm 2018

Nếu bạn là một Java web developer, chắc hẳn là bạn đã được tiếp xúc với vô vàn các Java Web Framework. Vì thế bạn cần một list có chọn lọc gồm 10 Java Web Framework tốt nhất sẽ hỗ trợ bạn được rất nhiều trong việc lập trình Java. 1. Spring MVC – Model View Controller Spring ...

Trần Trung Dũng viết 15:42 ngày 31/08/2018
0