Cascading Style Sheets (CSS3) is a simple mechanism for adding style (e.g. fonts, colors, spacing) to Web documents.

The above quote, taken from the W3C website, is one of the reasons for this site. Whilst I agree that it is a mechanism for adding style to web documents, I do not agree that it is a SIMPLE mechanism. It can be very complicated, as I found out when I took my first steps down this path.

CSSplay, by the way, is now listed on the w3c.org website.

So I have created this site in the hope that it will help newcomers to CSS and show old hands that it is more than just a mechanism for styling your documents. It is oh so much more.

Read more…

• 150 CSS Examples
• CSS3 Multi Column Feature
• Top 15 CSS articles
• How to design css sitemap Tree
• CSS tricks
• Top CSS Best Hacks
• Introduction to CSS3
• Write a CSS Syntax
• How CSS3 works
• Benefits of CSS

Filter Attribute and filter Property

Sets or retrieves the filter or collection of filters applied to the object.

Syntax

HTML
{ filter : sFilter }

Scripting
[ sFilter = ] object.style.filter

Read more…

• CSS ! important Declaration
• 150 CSS Examples
• Introduction to CSS3
• How to design css sitemap Tree
• How to create Rounded Corners Using CSS without Images
• Explaining CSS Positioning
• Which CSS Propertise using in Email Templates
• Variables in CSS?
• CSS Universal (*) Selector
• CSS media types rules

!important Declaration

Increases the weight or importance of a particular declaration.

Syntax

HTML
{ sRule!important  }

Scripting
N/A

Read more…

• CSS Filter Property
• 150 CSS Examples
• Introduction to CSS3
• How to design css sitemap Tree
• How to create Rounded Corners Using CSS without Images
• Explaining CSS Positioning
• Which CSS Propertise using in Email Templates
• Variables in CSS?
• CSS Universal (*) Selector
• CSS media types rules

Sets the media types for a set of rules in a styleSheet object.

Syntax

HTML
@media sMediaType { sRules }

Scripting
N/A

Possible Values

sMediaType String that specifies one of the following media types: screen    Output is intended for computer screens.     print    Output is intended for printed material and for documents viewed in Print Preview mode.     all    Output is intended for all devices.
sRules    String that specifies one or more rules in a styleSheet object.
Remarks
Read more…

• CSS Filter Property
• CSS ! important Declaration
• CSS Tips
• Organizing Your CSS Files
• 100 CSS Examples and Tutorials
• 150 CSS Examples
• Top CSS Tips
• Introduction to CSS3
• Margins and Absolute Positioning
• Top reasons sites break in IE 7

Introduction

With the @font-face {…} selector you have the possibility to import a font in a webpage. If it is not installed on the visitors computer, it is temporally available during the visit of your page. Sounds beautiful, is as simple solution, but …:

• This was possible according to the CSS2 specifications … ( here)
• This is not possible according to the CSS2.1 specifications … ( here)
• The trouble is, that the most browsers don’t support (fully) the CSS2 rules (using CSS2.1 instead), and cannot display the fonts defined by the @font-face {…} rules.
• This will be possible (far away) according to the CSS3 Working Draft, module: Web Fonts… ( here)

Font Descriptions and @font-face

The font description provides the bridge between an author’s font specification which is the data needed to format text and to render the abstract glyphs to which the characters map - the actual scalable outlines or bitmaps. Fonts are referenced by style sheet properties.

The font description is added to the font database and then used to select the relevant font data. The font description contains descriptors such as the location of the font data on the Web, and characterizations of that font data. The font descriptors are also needed to match the style sheet font properties to particular font data. The level of detail of a font description can vary from just the name of the font up to a list of glyph widths.

Font descriptors may be classified into three types:

1. those that provide the link between the CSS usage of the font and the font description (these have the same names as the corresponding CSS font properties),
2. the URI for the location of the font data,
3. those that further characterize the font, to provide a link between the font description and the font data.

Read more…

• CSS Filter Property
• CSS ! important Declaration
• CSS ID Selector
• Use shorthand CSS notation
• Organize your CSS-code
• HTML Basics
• CSS Framework
• 150 CSS Examples
• CSS background-size
• Using Logo with CSS