Lessons: 13Length: 1.1 hours
- Overview
- Transcript
1.2 What Is RSCSS?
Let’s begin by getting one thing straight: RSCSS is not a CSS framework. It’s a system for structuring your styles in a consistent, organized manner. In this lesson we’ll go over the basics of what RSCSS actually is.
1.Introduction
1.1Introduction00:52
1.2What Is RSCSS?02:14
2.Components and Elements
2.1RSCSS Components and Elements03:35
2.2Styling Components and Elements09:11
2.3Variants07:20
2.4Positioning Components06:24
2.5Nested Components07:44
2.6Nested Variants06:02
3.Other Considerations
3.1Creating Helper Classes02:57
3.2CSS File Structure02:15
3.3Using the Inverted Triangle06:49
3.4Planning Out Your Site07:11
4.Conclusion
4.1Final Thoughts00:44
1.2 What Is RSCSS?
Hello and welcome back, in this lesson I want to talk about what rscss is and what it can do for us as web designers and front end developers. If you've ever spent any time working on a large website or a large web project then you know how quickly your css can get out of hand. And if you're working with a large team of designers and developers, then it can get out of hand even more quickly. Because you've got a number of people, all developing with their own styles and their own preferences. Well rscss attempts to address this problem, in a very simple way, by giving us some suggestions and rules for structuring our style sheets. Now rscss stands for reasonable system for CSS style sheet structure. And that's a huge mouthful so that's why we're calling it rscss. But it's basically just a simple set of guidelines to help you structure your CSS in a way that's consistent so that if you go back to a website that you designed maybe six months ago or a year or two ago, you can easily go into your style sheets and know exactly what you're looking at. If you've followed all of the guidelines and suggestions within the rscss system, then you can easily go to where your component and elements are. You can easily find your variance and your helpers because you've followed a system that, that is consistent across the board. So as we go through this course we're gonna take a close look at the rscss system. And you can find a link to the rscss website in the course notes for this lesson. And this website actually gives you a pretty good outline of what we're going to be covering in this course. Now in this course we are going to take this a step further, we're going to be very hands on with this. And we're going to take a look at how we can take a website and the components and elements of a website and apply these rscss concepts to those designs. And we're gonna start in the next lesson by talking about components and elements which are the basic building blocks of any web design. So thank you for watching and I'll see you in the next lesson.
