I’d love to have an explanation of how classes work and the recommended processes for working with and naming them.
Classes are kinda important, and it would be great if Webflow (or some other interested and helpful party) could make an overview tutorial or document. The only tutorial I can find talks about how great they are, but not how to work with them (http://help.webflow.com/lesson/using-classes-and-adding-styles).
If someone wants to explain them to me, I’ll make an overview… 
Hi @tkister,
Classes of course aren’t Webflow specific but part of CSS and HTML so there is lots of info on the web. http://www.w3schools.com/html/html_classes.asp
For Webflow specific info, up at the top of the Forum you should have a blue/blackish bar that has “Courses” or “Full Site Tutorials” the full site tutorials cover class usage to some degree. Also, there was a workshop a few weeks ago specifically about classes that you can find here https://webflow.com/workshop/best-practices-for-site-structure-and-class-naming-convention.
There is also the youtube channel with this video https://www.youtube.com/watch?v=elZgT7DLA5M&feature=youtu.be and it’s not specifically about classes but goes over MANY aspects of Webflow.
Been there, done that. In the “workshop,” they only discuss classes for a few minutes.
I’d like a full explanation focused on the use of classes.
Please, Webflow.
So are you looking for information on what classes are and how they work in general?
Yes. Not from a general CSS perspective, but for Webflow in particular. What are the best practices for naming classes, for working with classes that you’d like to re-use,etc. For example, I’ve seen others on the forum mention that they create an extra page just for misc classes that they want to re-use, and I’d love to hear how to do this, what Webflow recommends, and how it works. Webflow could explain how classes appear in the actual code, so that the treatment in the Webflow UI makes more sense.
I can (and will, I’m sure) figure it out on my own, but it would be nice if Webflow provided the information.
I think it’s a reasonable request.
I think I understand what @tkister is talking about. It just general use of classes. I was, and guess I still am wondering how the pro name areas of the site. Keeps everything logic on a huge page.
I use page name then what it is. like | index hero h3 |** That is for the big text on the top of the site. If its a good name, I dont know.
If I make many simular pages i use | page (and then) main div | or something like that.
I also often rename classes if I use them on more than one page. A classic is. | form btn |
@tkister Okay, I was just trying to figure out if your “wish” was specific to Webflow or looking for general knowledge about classes.
What users are referring to in creating an extra page (that they either keep and don’t make visible or delete when the project is finished) is this – you build the elements you plan to use, give them a class or use the main class (for example ALLH1headings), then you style them via the CSS designer controls. Then those classes with the styles applied are available to use throughout the site. Taking that one step more, say you want a feature section to use on a few different pages then you would build your feature section and you could either copy and paste it to other pages. If you copy and pasted the features section for use on multiple pages but then wanted one page’s features section to look different you could add a nested class just for that page. Mat Vogels (https://webflow.com/mat) created a clonable Style Tile (https://preview.webflow.com/preview/style-tiles?preview=723625d5348fd97aa8d8f1b9e5964eb6) that works as a bit of an example on how you could setup your styles to be used throughout the other pages of your site.
There isn’t too much to explain about how the classes appear in the actual code other than a “w” is put before the Webflow default classes, and spaces and underscores are replaced by dashes. You can use the web inspector on your browser to inspect the code and see how the classes display. In the example below the class=“w-section” was the default class for a section – “base-full” was the class I added to style the section.
Honestly, I think class naming strategy and class nesting strategy comes down to the preferences of the person doing the work and is more than just related to Webflow but the design/development community at large. However, it’s been pretty widely discussed in the forums and here are few links…the post were Sergie gives some tips is older but still mostly applicable.
The videos do cover naming so you might give them another look.
Anyway, hope that helps.
Here’s my take on working with classes:
*Note that I’m not positive about any of this, which is why I would like Webflow to publish an official document on the topic.
Webflow works by using classes and combo classes, which are, essentially, parent and child classes, because the second (or third of fourth) class that you apply to an element only exists in a dependent relationship with the first (parent) class.
This can be confusing, because CSS doesn’t work this way – with CSS, you can create many classes independent of one another, and apply them to a single element without the parent-child dependency. So, with CSS, you can create a box shadow and apply it to a div or an image independent of other attributes, such as padding and position.
Webflow’s method can also cause a bit of extra work, because, if you want to create a consistent look (for example, use the same drop shadow on several different block elements), then you have to recreate the style for each different type of element. There is no way to save a shadow, so you have to remember each of the shadow values and enter them repeatedly.
A work-around in Webflow is to create a page just for creating “parent” classes. So, if you want to create a shadow that can be used on any block element, then create a miscellaneous page, create an element, give it a class name, and then configure the style that you want. Then you can apply this style as if it were a “parent,” or independent, class.
Dunno…
@tkister Not sure if you are asking a question or making a statement. Regardless, I guess it doesn’t hurt to wish but I think classes are pretty well covered in the tutorials. I’d prefer to see the Webflow team focusing 100% on new features instead of making a document about classes.
As you can see from the previous posts in this discussion (and the links to other posts, which were provided by you), there is a need for an overview about working with classes. I have attempted to provide some information based on my own experience.
What I’m really hoping for is an official Webflow tutorial focused on working with classes (in Webflow, not in general) and on best practices for naming classes (in Webflow).
@tikister What I’m saying is that classes are covered in many of the tutorials and users just have to put in the time to watch them. You can watch the tutorials and see how the Webflow staff are using, naming and structuring them. Also, the forum is here as a resource so new users like you can learn from the information that has already been shared. You just have to search for it.
I’m not looking for a tutorial in which classes are used incidentally – I’m looking for a tutorial that is an overview of classes, and focuses on using and naming classes.
I have already spent hours watching videos and reading forum posts. Yes, I can figure it out incrementally, based on anecdotes just like the one I shared above. I WISH for an overview. (Wish List and all…)
I think it’s perfectly reasonable and not at all weird to ask for this tutorial. Why is it such a big deal?
I don’t think it’s a big deal at all, and I completely agree with you that a course or document overviewing the things you’re requesting is a great idea. 
The information is already out there and I would prefer the Webflow team focus on product improvements. There are only so many hours in a day after all. I guess if the information isn’t delivered in a way that you or other users can easily consume it then maybe it’s a good idea.
@jdesign, how often do members on the forum have to answer questions about basic HTML and CSS functionality? Sure, the Webflow site-building videos are helpful for in-context learning, but the ideal Webflow user has experience in the HTML/CSS basics, or has at least taken a basic course on http://codecademy.com or something similar.
The more Webflow gains traction in the design community, the more the Webflow team can focus on product improvements. The best way to do that is to empower beginner Webflow users with the education they need to fully use Webflow.
@McGuire My point exactly! Webflow users do general have HTML/CSS (including classes) basics or more so it’s pretty easy to watch a few tutorials that are available, experiment a bit and very quickly see how classes can be used and nested. Like I said, if the information isn’t delivered in a way that is easily consumed maybe it’s a good idea to have an additional tutorial. I don’t really think it’s the job of Webflow staff to teach users about classes which was the topic of the post.
@tkister has posted a couple of threads that are all revolving around documentation and they have all been answered.
In one of the post this was shared.
It just seems that this post in the wish list (typically for product feature request) is just a repeat of those other post just a bit more specific. Additionally, I was actually hoping to just answer @tkister question about classes and to help her understand how to use them in Webflow and think I have done that.
As you posted, I was invited to request specific tutorials, and I have done so. (“Please let us know specifically what video tutorials you wish we had.”)
I think others may benefit from this as well, as indicated by the other forum posts asking questions about working with and naming classes in Webflow.
It’s pretty standard for a company to teach paying customers how to use their products.
@tkister I think you were supposed to post your tutorial request here Video Tutorial Requests not here Documentation and Training Videos but I’m sure they have the information either way. So why create a new post if those other options are available?
Companies usually provide training materials (Webflow does) but it’s typically up the user to learn how to use the product. Tutorials, email support and forum (user and expert support) are pretty typical.
Ultimately, do you now understand how to use classes in Webflow or not? I was trying to be helpful and think I answered nearly all your questions.
Here’s what I’ve done, I purchased a template (one that I like, however, you can easily get a free template instead of purchasing) and I am now dissecting all the styles, classes, layout, elements, and interactions…in the designer.
Sure it’s not as good as a course, but you are able to see a fully functional website built by Webflow and you have full access to all the classes, class naming, interactions…EVERYTHING, exactly done by Webflow. It is helping me learn quite a bit so far 
Hi @tkister, I agree with @McGuire, that it is a reasonable to ask for some additional videos/info about using classes in Webflow 
@PixelGeek, @Waldo, lets take a look further and see how we can help with this
