Loading...
 

CSS Attributes

CSS Guide  »  CSS Guide  »  CSS Attributes

Class and ID

Classes let you create grouping schemes among styled HTML tags by adding the style definition of a particular class to the style definitions of several different tags. In the stylesheet, a class name is preceded by a period (.) to identify it as such:

1

.foo {property 1:value 1; property 2:value 2}

A very simple example:

01

The tags and classes can then be used in combination:

1

"red">This is rendered as 30-point red serif text.

1

"red">This is rendered as 10-point red sans-serif text.

Or not:

1

This is rendered as 10-point sans-serif text in the defaultcolor.

The ID attribute is used for a uniquely defined style within a stylesheet. In the stylesheet, an ID name is preceded by a hash mark (#) to identify it as such:

1

#foo {property 1:value 1; property 2:value 2}

2

"foo">Text rendered in the foo style.

Text-Level Attributes: and 

The  tag is generally used to apply a style to inline text:

1

"foo">This text is rendered as foo-style and this is not.

The 

 tag is generally used to apply a style to a block of text, which can also include other HTML elements:

1

"foo">

2

The "foo" style will be applied to this text, and to "page.html">this text as well.

3

The style attribute provides a way to define a style for a single instance of an element:

1

"font-size:10pt; color:red">This text is rendered as red, 10-point type

The class, ID, and style attributed can be applied within the  and 

 elements. Used with class or ID, the  and 
 tags work like customized HTML tags, letting you define logical containers and apply a style to their contents.