Mary is trying to understand!
As with the previous week's "readings", I had a lot of fun playing around with W3C's tutorials and extremely helpful examples. The Cascading style sheet is a more efficient way of formatting the visual elements in an HTML document than using HTML itself to dictate the style. The value of the cascading style sheet is that the properties you manipulate are "inherited" throughout the document, so making a single change to the CSS changes everything controlled by the element you changed. Saves a lot of time if, for instance, the company you were working for rebranded itself and wants blue to be the dominant color instead of, say, green. The designer only has to make the necessary adjustments on the style sheet and the adjustment cascades throughout the elements controlled by the original code. There are pre-formatted CSS's out there, but I understand that it's important to know how to write it (and HTML, of course) by hand. It gives me more power over the design of web-based elements I will (hopefully!) be designing as I move back into the workforce.A piece of CSS that describes a change in style (a "rule') can be split into several different parts. The selector defines which element of a document will be modified; this can be a header, a paragraph, etc. The declaration does that just that: declares what qualities to display in relation to the selector. The declaration has two parts, a property and a value, which point specifically to discrete variables that can affect the appearance of the selector. In other words, I want to change the appearance of my first header (selector), so my declaration would be to change the color (value) of the font (property). These rules are governed by discrete semantics, which makes it seem pretty simple.
But it's not!
Formatting a coherent CSS requires a lot of abstract design before writing the style sheet. You (well, I) have to hold a design in you (my) mind the whole time we're dealing with brackets and curly brackets and hex codes and alignment buffers. I can start to understand what people mean when they call a piece of code "beautiful".Moving on, though.
The brilliant thing (but conceptually difficult) thing about CSS is that you can design the entire document in one go. That is, using the specified language provided by, say, W3C's cheat sheets, you can create an entire, consistent thematic design of a website without having to go in and manually change each and every element by hand. If you want your first three headings to be bright pink and in 36 pt Comic Sans, you can specify that in the CSS by simply listing h1 h2 and h3 as the selectors in your rule. No one but no one likes Comic Sans, though, so I don't advise it. Alternately, you can control the design elements of individual headers as their own selectors, and can nest commands like HTML. This is where I see it becoming really difficult to track changes across a long, plain text document.So, you've manipulated your selectors, declarations, values, and properties into a document that you're rather proud of. What next? You can stick your CSS right into the head of the HTML document and upload it to a browser. Apparently, however, some, but not all, browsers won't know how to read the kind of CSS you've used, and so it's important to tell the browser which language you're using. If some jerk browser is giving your CSS trouble, however, apparently you can insert the rules into HTML's "comment" command.
Also, I've gone and hit "Preview", and it turns out that all this CSS I've been trying to do hasn't affected the blog post. I tried to do the "Inspect Element" option, but while I can change the text color, it doesn't seem to stick. Can you see what I was trying to do here? I put some CSS into the HTML head, but I suppose the Blogger code trumps mine. After much tinkering around and swearing under my breath, it worked when I plugged it into the W3C "Try It!" window, which was comforting. I wanted a pinkish background with lovely yellow letters in the headers. All I got was centered headers. Better than nothing, I suppose. I can see how designing with CSS, combined with proper HTML, can be simultaneously satisfying and infuriating.