Lessee here...well, first off, anything with a dot after it is actually a class, not something built into CSS. If you're taking it from
this result that I found on Google, notice how the div says class="clearfix" on it. In this case, clearfix is just the name of a hack someone's made, but you could call it anything as long as the page elements you make have the same class name.
As for the first margin line,
this link might help. Pages have a top, right, bottom, AND left margin, but if you're going for any type of symmetry at all, usually you don't want them all to be different. In this case, the first number (0) is the top AND the bottom margin, while the second value (auto) is the left and the right margin. That's probably so that your content all starts right at the top (0 top margin) but by putting an automatic margin on both sides, it will also stay in the middle of the page no matter how wide your screen is.
As for your second question, I'm not certain exactly what you're referring to (and since it's a clearfix thing, it's someone's personal hack rather than an official CSS thing) but you can Google "CSS clear" or "CSS content", etc. to get some pretty good pages that explain what each keyword does. The first result is usually W3Schools, and they have a "Try it yourself" button that shows you how each particular tag works.
Best of luck with your programming!
