CSS Exploration #3

As I am in the midst of understanding CSS vocabulary and not yet done, I need to stop and let these foundational terms sink in before I go further. Here is my key terms list for today (all taken from the Mozilla CSS tutorial site):

DOM: "The browser converts the markup language and the CSS into a structure called the DOM (Document Object Model). The DOM represents the document in the computer's memory. It combines the document's content with its style …The browser displays the contents of the DOM."

Rule: A line of CSS, also called a tag or type and shown by a p.  The part inside the curly braces is the declaration.  The keyword color is a property, and red is a value. The semicolon after the property-value pair separates it from other property-value pairs in the same declaration. 

Selector: Identifies which elements in the DOM to apply CSS to (example = "strong" makes things bolder than rest of page)

Inheritance: For styles in the cascade, author stylesheets have priority, then reader stylesheets, then the browser's defaults. For inherited styles, a child node's own style has priority over style inherited from its parent. Two ways to control inheritance are ...

• Class – can group elements to receive same properties (use a full stop before this) 
• ID – to assign a property to one specific element (use hashtag)

Inheritance among these three works in this way: An ID selector is more specific than a class selector, which in turn is more specific than a tag selector (# rules then . then p).

My next tutorial will focus on playing with CSS coding.  I explored some this week, enough to feel both accomplished and like I have no idea what I am doing!

Rhetorical Analysis of Text Using CSS:
I decided to return to the CSS Zen Garden for this assignment (here is my first foray into CSS Zen) because I knew I could see many different uses of CSS at this site ... plus I thought I could now understand better what I was seeing after my dabbling thus far in CSS. I decided to explore the Kyoto Garden this time.

I used my new knowledge of "Inspect" to see the coding underneath the webpage. I had to give myself a pat on the back because I could follow much of what I discovered in this "inspection."  However, I have learned that I need to understand how to uncover linked CSS files when I try to view the source code.  I explored a few more pages this way and found the link command in the HTML that I know links to the CSS file.  I could click on some but not on others ... something to keep exploring.


However, I am not looking at this page for the coding behind it.  Instead, let me consider the rhetorical qualities of the CSS Zen Garden.  Certainly, this page fully shows Brooke's idea of pattern (as the new media version of arrangement).  Because the user can choose the design they wish to see the same content within, the producer and the user are working together to craft pattern.  The CSS Zen Garden has also fully embraced Brooke's concept of performance (as the new media version of delivery).  By constructing the whole page as user-driven, the performance becomes one of constant movement between reader and creator.  To see the CSS Zen Garden as the interplay between pattern and performance is to understand fully what both the creators of this page wanted to achieve as well as what CSS can achieve.  CSS can become the pattern tool of a webpage, and that is exactly the message that creators of the Zen Garden wanted to impart.  They chose a great rhetorical method for this argument -- by allowing the readers to become CSS programmers who can change the pattern on the page, the performance of the page becomes the message.


(And yes, I am now thinking about McLuhan's "the media is the message"!)

Time spent: 1 1/2 hours

Work Cited:
Brooke, Collin Gifford. Lingua Fracta: Towards a Rhetoric of New Media. New Dimensions in Computers and Composition. Ed. Gail E. Hawisher and Cynthia Selfe. Cresskill, NJ: Hampton Press, In., 2009. Print.