to the main page about the tutorial  THE XML REVOLUTION  -  TECHNOLOGIES FOR THE FUTURE WEB back up next

A CSS example

The CSS2 language extends the CSS ideas from HTML to XML.

The following CSS2 stylesheet also makes business cards visible in the browser: 

card  { background-color: #cccccc; border: none; width: 300;}
name  { display: block; font-size: 20pt; margin-left: 0; }
title { display: block; margin-left: 20pt;}
email { display: block; font-family: monospace; margin-left: 20pt;}
phone { display: block; margin-left: 20pt;}

The transformation applied to the business card: 

<card>
  <name>John Doe</name>
  <title>CEO, Widget Inc.</title>
  <email>john.doe@widget.com</email>
  <phone>(202) 555-1414</phone>
  <logo url="widget.gif"/>
</card>

looks like:

John Doe
CEO, Widget Inc.
john.doe@widget.com
(202) 555-1414

CSS2 is very limited compared to XSLT:

back COPYRIGHT © 2000-2003 ANDERS MØLLER & MICHAEL I. SCHWARTZBACH next