Syntax Rules of WCSS

Preferences - Do not show ads

The syntax rules of WCSS are not difficult to learn. A WCSS statement is consisted of a selector, a property, and a property value. The selector specifies the element(s) affected by the style rule. Typically, the selector is the XHTML MP element that you want to apply the style to (there are other types of selectors and they will be covered later at "Different Types of Selectors"). The property specifies the style you want to set. The property value is the value that you assign to a certain property. The syntax of a WAP CSS statement is like this:

selector {property: property_value}

This is an example of a WAP CSS statement:

p {text-align: right}

The above style statement tells the WAP browser to align the text enclosed within all <p></p> tags to the right horizontally.

Multiple properties are separated with a semicolon. The syntax is like this:

selector {property1: property_value1; property2: property_value2; ... propertyN: property_valueN}

Below is another WCSS example. The style statement tells the WAP browser to align the text enclosed within all <p></p> tags to the right and change the text color to blue.

p {text-align: right; color: blue}

Specifying more than one selector is allowed. A comma is used to separate the selectors. The syntax is like this:

selector1, selector2, ... selectorN {property1: property_value1}

Let's have a look at another WCSS example. The style statement below will cause the text enclosed in all <p></p> and <h1></h1> tag pairs to be aligned to the right horizontally and shown in blue color.

p, h1 {text-align: right; color: blue}

Comments in WCSS

In WCSS, comments are enclosed within /* and */. WAP browsers ignore all comments. This example demonstrates the use of comments in WCSS:

p {
  /* A single line comment in WAP CSS */
  /* A multi-line comment
     in WAP CSS */
  text-align: right; /* A comment can be placed at the end of a line. */
  color: blue

Page 3 of 39 Previous Page | Next Page
Contents at a Glance
Print this Web Page | | Back to Top

Feedback Form (Expand)

What do you think about this web page?

WCSS Tutorial Table of Contents WCSS Tutorial Contents at a Glance Preferences - Change Color Scheme Preferences - Do Not Show Ads Previous Page Next Page