CSS for Dummies Pt. 2

Welcome back everyone! If you haven’t already read Pt. 1 in our Programming Language series head over to our HTML for Dummies and check it out. So lets continue where we left off. In the previous article we talked about the basic terms associated with HTML and how they work when starting an HTML document. But what about CSS? Well lets jump in and go over what I want to cover in this article. Similarly to the HTML article I want to go over some of the common terms associated with CSS and how they work in relation to HTML. Remember from the previous article, HMTL and CSS are two separate languages and should be treated that way. So similarly to HTML there are several common terms in CSS that you want to be familiar with. With this article, the goal is to make sure that these terms are understood completely and become second nature to recall and explain. Lets dive in and learn about the wonderful world of CSS!

The first term that we can cover is Selectors. So what are Selectors? When elements, remember our HTML article, are added to a page, the selector labels exactly which element(s) within the HTML is targeted and has styles (color, size, position) applied to it. Selectors often include a combination of different qualifiers to select unique elements, all depending on how specific you wish to be. For example, we may want to select every header on a page, or we may want to select only one specific header on a page.Selectors generally target an attribute value, such as an id or class value, or target the type of element, such as h1 or /h1. Within CSS, selectors are followed with “fancy” brackets, {}, which encompass the styles to be applied to the selected element. Now lets move onto our next term!

So once you have an element selected it will display that elements Properties. Properties are essentially the different styles that the element can have changed and edited. For example: background color, font, font color, font-size, height, and width and any new properties that get added. The list of properties fall underneath the fancy brackets {} in a list format so you can easily edit it and make your changes. Now we can cover our final term for CSS.

Last but not least is Values. We have covered elements, from HTML, and selecting them and the properties that we can edit. Values are how we choose to edit our properties. So for example if for font-size I could make it 12 or 14 or whatever. The value is what I make the property be. Colors are values, numbers are usually values, height or width or font-size are all considered values.

So this is a little shorter than the HTML article but at the same time the CSS terms are a little easier to wrap your heads around. Hopefully this article explained the relationship that HTML and CSS have with each other. In the next article we can delve into some of the more finer points of CSS and their uses.


Leave a Reply