Remember, when several selectors share the same declarations, they may be grouped together to save writing the same rule more than once. Each selector must be separated by a comma.
Two cases exists to handle group of selector. The quick and limited solution
(accept only two selectors in a same group) with :
HTML_CSS::setSameStyle()
.
And the extended/common solution with :
HTML_CSS::createGroup()
,
HTML_CSS::setGroupStyle()
,
HTML_CSS::addGroupSelector()
and
HTML_CSS::removeGroupSelector()
.
HTML_CSS::createGroup()
creates basically
a group for selectors given as first argument. You can identify this group
by an identifier (alphanumeric) or let HTML_CSS manage an internal numeric
identifier itself.
Let creates this group of selectors :
#main p, #main ul { padding-top: 1em; color: red; }
Identifier is named myGroupID in this example:
<?php
require_once 'HTML/CSS.php';
$css = new HTML_CSS();
$g1 = $css->createGroup('#main p, #main ul', 'myGroupID');
$css->setGroupStyle($g1, 'padding-top', '1em');
$css->setGroupStyle($g1, 'color', 'red');
$css->display();
?>
This is the default behavior.
<?php
require_once 'HTML/CSS.php';
$css = new HTML_CSS();
$g1 = $css->createGroup('#main p, #main ul');
$css->setGroupStyle($g1, 'padding-top', '1em');
$css->setGroupStyle($g1, 'color', 'red');
$css->display();
?>
With
HTML_CSS::addGroupSelector()
and
HTML_CSS::removeGroupSelector()
, we have ability to
add or remove one selector from a selectors list (of a group).
Suppose we have these selectors :
html, body { margin: 2px; padding: 0; border: 0; }
and we want to apply same share properties to new class 'large' and do not anymore apply it to 'body'.
Here are how to do :
<?php
require_once 'HTML/CSS.php';
$css = new HTML_CSS();
// 1. create the pre-requires data
$g1 = $css->createGroup('html, body');
$css->setGroupStyle($g1, 'margin', '2px');
$css->setGroupStyle($g1, 'padding', '0');
$css->setGroupStyle($g1, 'border', '0');
// 2. remove the body selector
$css->removeGroupSelector(1, 'body');
// 3. add the new 'large' class
$css->addGroupSelector(1, '.large');
$css->display();
?>
Remember that HTML_CSS handle group (numeric) identifier itself (begin at 1, and go to 2, 3, and more).