Next-generation CSS allows you to create a group of properties that can be applied at the same time. This is like a variable that can have more than one property.
- [Narrator] Next Generation CSS is going to allow you…to create a group of properties…that can be applied at the same time.…Now, this is like a variable,…but it can have more than one property.…So, let's take a look at how that works.…You need to add the group of elements in your root section,…just like you would any other variable definition.…You create a name, just like you do with a variable,…using double dashes at the beginning of the name.…Now, whenever you want to use this group property,…you can add an @apply command…and then use the variable name.…
There is no need to add a colon…between the @apply and the variable name.…So let's take a look at how we can use that in our layout.…What I want to do next is just create a property…that allows me to add a different sort of width…to these elements, because these elements right now…are sort of going the full width of the container,…and although it may look okay right now,…when this gets really wide, this line width is way too wide.…So let's go ahead and first add some variables…
- Organizing your CSS into partials
- Creating variables
- Using custom selectors
- Working with flexbox layouts
- Setting up a mobile layout
- Making your features responsive
- Alternating layouts
- Adding animation
- Adding videos
Skill Level Advanced
Design the Web: Responsive SVG Imageswith Chris Converse22m 46s Beginner
Building Responsive Forms with Flexboxwith James Williamson1h 19m Intermediate
1. Getting Started
2. Headers and Footers
3. Featured Content
Next steps1m 6s
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
This will not affect your course history, your reports, or your certificates of completion for this course.Cancel
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.