27 useful CSS framework recommendations

Using the CSS framework can simplify your work and improve work efficiency. The CSS framework is a collection of CSS files, including basic element resets, page layout, grid layout, form styles, general rules and other code blocks. Here are 27 excellent CSS frameworks recommended for you that you can choose from.

1. 960gs

The page width of 960 pixels seems to have become a design standard, which can display web content well under various current resolutions. More commonly used sizes are provided to simplify the web design process, making the work simple and efficient.

2. YUI 2: Grids CSS

Mango once introduced YUI launched by the Yahoo development team, and this YUI Grids CSS is part of it. As one of the most famous CSS frameworks, YUI Grids CSS provides four preset page widths and six preset templates. Among them, the negative margin technology, using the measurement unit em, clearing layout floats and other technologies are very worthy of learning and reference.

3. Blueprint

Blueprint is a mature CSS framework that divides layout, typography, widget, reset, and print into different CSS files. During web design, the code introduced is reduced and the page loading efficiency is improved.

4. BlueTrip

BlueTrip is a CSS framework that integrates the best parts of the BluePrint & Tripoli framework; the print style of Hartija; the simplicity of 960.gs; and the Elements icon. Provide you with a useful style collection and a common method for making websites. This way you can focus on designing.

5. Elastic CSS

Elastic is a simple CSS framework used to layout web pages. Elastic enables a wide variety of common web page layouts.

6. Easy

The popular JQUERY component functions on the market have been incorporated into its framework. You only need to use this framework directly without having to learn complex AJAX JQuery syntax, which is very convenient.

7. EZ-CSS

EZ-CSS is a lightweight, browser-friendly, easy-to-use CSS framework. Used to create complex page layouts with CSS+p.

8. Tripoli

Tripoli is a general CSS specification for HTML presentation. By resetting and rebuilding browser standards, Tripoli provides a foundation for standard, cross-browser performance for your website projects.

9. CleverCSS

CleverCSS is a small Python-inspired markup language for CSS that can be used to create a stylesheet in a clean and structured way. In many ways it is cleaner and more powerful than CSS2. The most obvious difference with CSS is the syntax: it is based on indentation and is not monotonous. Although this is obviously against the rules of Python, it is still a good idea for organizing styles.

10. SenCSS

It provides reasonable styles for the repeated parts of your CSS, so that you can pay more attention to the style of your website. Unlike other CSS frameworks, SenCSs does not include various complicated layout styles or predefined grid systems. So what can SenCSs do? Baseline, fonts, paddings, margins, tables, lists, headers, blockquotes, forms, etc. are all what SenCSs can do.

11. Emastic

Emastic is a CSS framework with a continuous mission: to explore strange new worlds, to find new life and new website spaces, and to boldly go where CSS frameworks have not yet reached. It is lightweight, user-friendly on page widths, and uses fixed and non-fixed column widths in the grid. Elastic uses "em" layout.

12. Typogridphy

Typogridphy is a CSS framework suitable for grid layout, which is used to help web designers and front-end developers quickly code to achieve beautiful grid layout. It allows you to quickly create a variety of grid layouts with ease and simplicity. The CSS of this framework fully complies with semantic validation, strict Xhtml and other standards.

13. Less Framework 3

It is a CSS framework based on less.js that makes full use of its advanced features such as mixins, variables, and nesting.

14. Elements

It is a very lightweight CSS framework. Judging from its code organization structure, the author obviously hopes that the entire project can be deployed in its CSS framework.

15. Boilerplate

It is a preset template for HTML/CSS/JS, which can help you build a cross-browser website that supports HTML5-CSS3.

16. Malo

An ultra-small, flexible, easy-to-use, personalized page with variable width.

17. The 1kb CSS Grid

If you only need a lightweight CSS grid system to build the main framework of your website, then you can try 1Kb CSS Grid. The 1KB CSS Grid website provides a generator to customize the CSS grid, and you can directly download the customized CSS grid.

18. Fluid Grid System

The text of a website's navigation menu cannot provide enough information to express the content of the current menu button. The general solution is to use tooltip information. Then the mobile navigation menu can also solve this problem and also add some fashion to the website design. And dynamic elements.

19. Content with Style

Content with Style The next logical step is to extend this into a CSS framework, allowing for rapid development of websites using already written and tested components. What is actually needed is a set of naming conventions and a flexible base template.

20. WYMstyle

WYMstyle is a set of CSS files that you can easily combine to quickly create the layout of your website. By providing reliable, well-tested CSS modules, WYMstyle strives to prevent every website from tedious cross-browser compatibility testing.

21. The Golden Grid

It is a relatively new CSS framework developed by vladocar, which can provide a new layout reference for modern website design. It's very compact, so it's easy to learn and use. Some of the methods of handling layout are worth learning from. If you understand the 960 grid system, then this framework will be easier for you to use.

22. Yet Another Multicolumn Layout (YAML)

YAML is a (X)HTML/CSS framework developed for flexible and user-friendly layouts. YAML has provided extensive and comprehensive documentation since its emergence in 2007. Like many other CSS-Frameworks such as Blueprint CSS or YUI Grids, it provides a system of predefined CSS-classes for creating grid-based layouts. To create a layout, a designer creates the HTML structure of the website, then writes the CSS for the containers (html tags), and the rest is taken care of.

23. Compass

Compass is a style authoring framework that makes your style sheets and markup easy to create and maintain. Write your own styles using sass instead of the original css. By combining Mixins and Compass in Sass, you can use style frameworks such as Blueprint to replace your own style tags. Compass is based on sass, and you can use css frameworks such as Blueprint. It is very Convenient.

24. Schema Web Design Framework

Schema is a presentation-layer web page framework designed to provide the necessary CSS and HTML tags for repetitive design tasks. Rather than creating HTML/CSS from scratch for every new website project, Schema provides the necessary foundation to get started and get your design running in no time.

25. Sparkl

It is a very mature system, it is small, flexible, easy to learn and use.

26. The jQuery UI CSS Framework

​It is a set of UI controls and mouse interaction components with skin changing functions based on jquery. Used to help developers build web applications with a good user experience. Provides a powerful CSS Framework for user-defined widgets using jQuery. The ThemeRoller among them allows you to operate and design different styles of web interfaces as you like.

27. 52framework

It is a web development framework that implements HTML5 and CSS3. It is a cross-browser framework that can run on all major browsers, including IE6. It is mainly implemented using an HTML5 enabling JavaScript file.

The above is the detailed content of 27 useful CSS framework recommendations. For more information, please follow other related articles on the PHP Chinese website!