Feb 19 2010
CSS
7: Style Sheet Building Blocks
Adding Comments to Style Rules (p. 121)
/* Images will have a solid red border */
img {color:red; border: solid}
The Cascade: When Rules Collide (pp. 122-3)
body {background:url(bg_flax.jpg) bottom right no-repeat}
p {font-family: "Trebuchet MS", "Helvetica", sans-serif; font-weight: bold; color:#3366cc; }
img {float:left;margin-right:10px}
I am continually amazed at the beautiful, delicate Blue Flax that somehow took hold in my garden. They are awash in color every morning, yet not a single flower remains by the afternoon. They are the very definition of ephemeral.
© 2002 by Blue Flax Society.
The Cascade: When Rules Collide (pp. 122-3)
specificity.css
p {color:red}
p.group {color:blue}
p#one {color:green}
p#one {color:magenta}
Here's a generic p element. It will be red.
Here's a group-class p element. There are two rules that apply, but since the p.group rule is more specific, this paragraph will be blue.
Here's a p element with an id of one. There are four rules that could apply to this paragraph. The first two are overruled by the more specific last two. The position breaks the tie between the last two: the one that appears later wins, and thus this paragraph will be magenta.
Linking External Style Sheets (p. 129
img {border: 4px solid red}
I love the Palau de la Música. It is ornate and gaudy and everything that was wonderful about modernism. It's also the home of the Orfeó Català, where I learned the benefits of Moscatell.
There are fields and fields of sunflowers, that turn with the passing of the sun.
HTML
Offering Alternate Style Sheets (p. 130
img {border: 4px solid red}
img {border-style: dashed}
img {border-style: dotted}
I love the Palau de la Música. It is ornate and gaudy and everything that was wonderful about modernism. It's also the home of the Orfeó Català, where I learned the benefits of Moscatell.
Creating an Internal Style Sheet (p. 131)
I love the Palau de la Música. It is ornate and gaudy and everything that was wonderful about modernism. It's also the home of the Orfeó Català, where I learned the benefits of Moscatell.
Importing External Style Sheets (p. 132)
I love the Palau de la Música. It is ornate and gaudy and everything that was wonderful about modernism. It's also the home of the Orfeó Català, where I learned the benefits of Moscatell.
Using Media-Specific Style Sheets (p. 133
Applying Styles Locally (p. 134)
I love the Palau de la Música. It is ornate and gaudy and everything that was wonderful about modernism. It's also the home of the Orfeó Català, where I learned the benefits of Moscatell.
The Importance of Location (p. 135)
9: Defining Selectors
Save Antoni Gaudi again, use as example and lecture , make sure the
ID
Div tag
redo this page step by step
Database concept of style storage
Class apply class to elements
elements within context using nesting idea, inheritance
ID
Div tag
p class = ""
div class = ""
10: Formatting with Styles
Antoni Gaudí's incredible buildings bring millions of tourists to Barcelona each year.
Gaudí's non-conformity, already visible in his teenage years, coupled with his quiet but firm devotion to the church, made a unique foundation for his thoughts and ideas. His search for simplicity, based on his careful observations of nature are quite apparent in his work, from the Park Guell and its incredible sculptures and mosaics, to the Church of the Sacred Family and its organic, bulbous towers.
The complicatedly named and curiously unfinished masterpiece that is the Expiatory Temple of the Sacred Family is the most visited building in Barcelona. In it, Gaudí combines his vision of nature and architecture with his devotion to his faith. His focus on this project was so intense that he shunned all other projects, slept in an apartment at the work site surrounded by plans and drawings, and so completely ignored his dissheveled appearance that when, in 1926, he was struck by a streetcar in front of the church, he was mistaken for an indigent and brought to a hospital for the poor where he died soon thereafter.
The Sagrada Família attracts even the non-religious to its doors in large part due to this tragic story and its still unfinished state, of which the everpresent scaffolding and cranes are permanent reminders. But there is something more. In the Sagrada Família, Gaudí again brings nature and architecture together--the soaring spires look something like rising stalagmites in an underground cave--this time in reverance.
The Park Guell always reminds me of Howard Roark in Ayn Rand's The Fountainhead. Gaudí's project in the Park Guell was to build a residential community whose residents would love where they lived. It was never finished.
Perhaps that is for the best, since now we all get to enjoy it. The Park Guell is set on a hill overlooking practically all of Barcelona. Its beautiful and even comfortable serpentine bench is filled with foreigners and locals alike every day of the week. Its mosaic lizard have become synonymous with the city itself.
Quiz
