The group of property to CSS3

---------------------------------------------------------
------------------------

The @group-property rule

The group of property to CSS3

			
	Note 20 September 2001.
---------------------------------------------------------
------------------------

Abstract
========  
	When one is built it paginates for 
internet, it is indispensable to declare many 
styles, for layers and dynamic effects.   
	The current form of declaring many 
layers with style sheets, increases the size 
and the complexity of the file of it paginates 
it.  
	A solution is to summarize many 
properties, in a single general property.  
	For this reason I propose, to 
create a called rule: "@ property."  
	This rule provides the advantage 
of declaring a property that contains other 
sub properties that can be defined in an 
unique rule.   

Syntax:  
================================
================================
===

	@ property { new property 
{property property property etc.... } }  

================================
================================
===

@ property: this rule defines a new nested 
property. Name alternative: @group-
property, @rule, @multi-property, etc..  
-----------
  
new property: name of a new property 
assigned by the user.  
-------------
  
property: properties of a style sheets. 
---------

 
	 The '@rule' property is a 
shorthand property for setting the individual  
element properties ('background-
color', 'position', 'color', 'padding-right', 
etc....) at the same place in the style sheet. 

Each value included in a rule "@ property", it 
acquires when being declared the 
value "initial."  

To reduce the size of style sheets, one can 
group properties. 

Here are a few example:

1. Source:(setting properties for many 
elements )
===========

	@property box { position width 
height top left clip overflow background-
color }


2. HTML Style sheet:(only setting properties 
on the element)
====================

	<DIV style="box: absolute 
200px initial 4% citrus rect(34px,50px) 
scroll;">...</DIV>


3. Style sheet:(The following rules are 
equivalent)
============

DIV { 
		position: absolute; 
		width: 200px;
		height: initial;
		top: 4%;
		left: citrus;       /*  
property with invalid value  */
		clip: rect(34px,50px);
		overflow: scroll;
		background-color: ; /*  
empty property  */
	}



Example:
========

<HTML>
  <HEAD>
    <TITLE>@Rule for CSS3</TITLE>
    <STYLE TYPE="text/css">
      @ property {

		box { position top left 
overflow visibility }

		trunk { display color 
font-size font-family background-image }
            }
    </STYLE>
  </HEAD>
  <BODY>
    <DIV STYLE="box: relative 3em 5em 
auto hidden;"> Celtic</DIV>
    <DIV STYLE="box: fixed auto 1em 
hidden inherit;"> Celtic2</DIV>

    <P STYLE="trunk: none green 12px Arial 
url(server.jpg);"> TextCeltic</P>

  </BODY>
</HTML>


Note:
=====
	Excuse grammar's errors, since I 
don't speak English. It is because I live in 
America of the South,and speaks Spanish 
better.  
And I would like a lot that includes this idea 
in CSS3.

			Jhon Uriarte
(from Argentina)




Tu correo gratis en MixMail http://www.mixmail.com
Mete 15.000 amigos en tu casa http://chat.ya.com

Received on Friday, 28 September 2001 19:26:22 UTC