CSS Summary
That wraps up this CSS tutorial — congratulations for making it to the end!.
In this tutorial, we learned that CSS stands for Cascading Style Sheets and that it is used for applying styles to web pages. We learned how to code and implement CSS using the "inline", "embedded", and "external" method.
We learned about classes and ids before applying styles such as font, backgrounds, borders, margins and more.
We then covered the more advanced topics such as position, float, layers, flexbox, and grid, which helps us to create some pretty cool layouts.
Next Steps
There's a lot more to CSS than was presented in this tutorial. Check out the CSS and CSS3 properties below to see the new features that are being implemented. And while you're here, check out how Sass can help you create CSS faster, and more efficiently.
-
Grid Layout Tutorial
Grid layout is the long-awaited layout model that allows us to create advanced website layouts quickly and easily.
This tutorial explains what grid is and how it works. Plenty of examples and screenshots.
-
CSS Reference
This is a full CSS reference that contains CSS properties, functions, @-rules, data types, and more.
You can also filter this large list by keyword for quicker access.
-
Sass Tutorial
Sass stands for Syntactically Awesome StyleSheets. It is a CSS preprocessor that helps you create CSS. Sass is especially handy for large CSS files and can help with the maintainability of the style sheets, as well as speed up development.
Sass also provides extensions to CSS such as variables, functions, nesting, and mixins. This allows you to take more of a programatic approach to your style sheets.
-
HTML/CSS Templates
Free CSS based templates that you can use to start your website from.
Responsive templates that automatically adjust their layout according to the screen size.
This is achieved using CSS media queries, which can be used to display different styles for different screen sizes.
Go to HTML Templates