HTML5, CSS3, and JavaScript Fourth Edition

(Ben Green) #1

CHAPTER 38. CH35 CONTENT, PRESENTATION, ACTION 302


38.3 Monolithic Pages


Style is the presentation of the content. It includes centering, margins, fonts,
colors, borders, columns, and other aspects of layout.


The word “monolith” literally means “one rock” and refers to the lack of
separate structure. If you pour some lava into a mold and let it cool, it will
harden into a chunk of rock without any discernible structure. It’s just all
mixed together.


In the olden days (and you will still find webpages that do it this way), all
style was implemented through directivesembeddedin the webpage. We
already saw a couple of these: for bold, andfor italic. But there
were many others, including the use of tables for layout, and especially the
use of special properties of markup elements.


The presentation was embedded deeply into each webpage. Changing the
presentation could be very difficult, and could require modifying lots of
separate webpages.


This is seen as a bad thing.


38.4 Cascading Style


Modern style is most often implemented through Cascading Style Sheets
(CSS). This largely separates the presentation from the content, and that
is a good thing.


Instead of marking a phrase as “yellow background,” we put it into a class
called, for example, highlight. Then we specify that highlight includes yellow
background.


If we want to change from yellow to pink, it is an easy matter, with a single
change to a single place in the website. All sections belonging the the class
“highlight” will immediately change to pink background.


38.5 Separating Form and Content


There are many good reasons for getting away from the monolithic coding
approaches of yesterday. The reason I like best is this: