|
|
(Next) Output |
||||
| |
|||||
|
|||||
One of the great features of HTML_CSS is to parse and load existing style sheet from different data sources : (simple string, css file, combine). We will see in detail all these possibilities with 3 methods : HTML_CSS::parseString(), HTML_CSS::parseFile() and HTML_CSS::parseData().
A quick way to create multiple selector definitions in one step is to use the HTML_CSS::parseString() function.
Let creates these definitions :
html, body {
margin: 2px;
padding: 0px;
border: 0px;
}
p, body {
margin: 4px;
}
Very easy with such script :
<?php
require_once 'HTML/CSS.php';
$css = new HTML_CSS();
$strcss = '
html, body {
margin: 2px;
padding: 0px;
border: 0px;
}
p, body {
margin: 4px;
}
';
$css->parseString($strcss);
$css->display();
?>
Another quick way to create multiple selector definitions in one step is to use the HTML_CSS::parseFile() function. CSS file to load is supposed to be W3C/CSS compliant.
If previous selector definitions was into a file named 'styles.css', then to parse and load contents will be done with such script :
<?php
require_once 'HTML/CSS.php';
$css = new HTML_CSS();
$css->parseFile('styles.css');
$css->display();
?>
If there are duplicate definitions into file contents, you should parse file with call :
<?php
$css->parseFile('styles.css', true);
?>
We have already seen two single sources where CSS data could come from. The last one allow to parse data from multiple sources at once. HTML_CSS::parseData() function take an array as first argument. Each item is either a filename (with .css extension) or a string. Each source is merge to produce at end a unique style sheet.
In script below we load selector definitions from two independent sources: a string and a css file which contents duplicate definitions (parseFile() 2nd argument to set to true to catch this situation; see next section for explains). Internet Explorer).
<?php
require_once 'HTML/CSS.php';
$css = new HTML_CSS();
// 1. a string to parse
$strcss = '
body, p { background-color: white; font: 1.2em Arial; }
p, div#black { color: black; }
div{ color: green; }
p { margin-left: 3em; }
';
$css->parseString($strcss);
// 2. a css file with duplicate definitions
$css->parseFile('iehack.css', true);
$css->display();
?>
Internet Explorer <= 6 does not handle box model in same way as others browsers that are better W3C compliant. For this reason, we need to fix boxes size with a hack such as this one you can find in example that follow. You can notice the duplicate 'voice-family' and 'height' properties.
To parse these definitions we need to activate the duplicate option of HTML_CSS.
#header {
background-color: ivory;
font-family: "Times New Roman", Times, serif;
font-size: 5mm;
text-align: center;
/* IE 5.5 */
height:81px;
border-top:1px solid #000;
border-right:1px solid #000;
border-left:1px solid #000;
voice-family: "\"}\"";
voice-family: inherit;
/* IE 6 */
height: 99px;
}
There are two ways :
global to all functions: set option allowduplicates on class constructor
local to a function: set argument duplicates to TRUE
For example here, we could wrote either (allow global duplicate) :
<?php
require_once 'HTML/CSS.php';
$attr = array('allowduplicates' => true);
$css = new HTML_CSS($attr);
$strcss = '
#header {
background-color: ivory;
font-family: "Times New Roman", Times, serif;
font-size: 5mm;
text-align: center;
/* IE 5.5 */
height:81px;
border-top:1px solid #000;
border-right:1px solid #000;
border-left:1px solid #000;
voice-family: "\"}\"";
voice-family: inherit;
/* IE 6 */
height: 99px;
}
';
$css->parseString($strcss);
$css->display();
?>
<?php
require_once 'HTML/CSS.php';
$css = new HTML_CSS();
$strcss = '
#header {
background-color: ivory;
font-family: "Times New Roman", Times, serif;
font-size: 5mm;
text-align: center;
/* IE 5.5 */
height:81px;
border-top:1px solid #000;
border-right:1px solid #000;
border-left:1px solid #000;
voice-family: "\"}\"";
voice-family: inherit;
/* IE 6 */
height: 99px;
}
';
$css->parseString($strcss, true);
$css->display();
?>
|
|
(Next) Output |
||||||||
| |
|||||||||
|
|||||||||