<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>
Searching for a group of selectors
</title>
<link rel="stylesheet" href="book.css" type="text/css" />
<meta name="generator" content="DocBook XSL Stylesheets V1.69.1" />
<link rel="start" href="index.html" title="HTML_CSS Manual" />
<link rel="up" href="ch07.html" title=
"Chapter 7. Searching for selectors and properties " />
<link rel="prev" href="ch07.html" title=
"Chapter 7. Searching for selectors and properties " />
<link rel="next" href="ch07s03.html" title=
"Searching for selectors that set a property " />
<style type="text/css">
/*<![CDATA[*/
body {
background-color: white;
color: black;
}
:link { color: #0000FF }
:visited { color: #840084 }
:active { color: #0000FF }
div.c2 {font-family: monospace;}
h2.c1 {clear: both}
/*]]>*/
</style>
</head>
<body>
<table class="htmlcssHeader">
<tr>
<td>
<img src="img/pearsmall.gif" align="left" alt="PEAR logo" />
<h1>
HTML_CSS : The Definitive Guide
</h1>
<div class="navheader">
<table width="100%" summary="Navigation header">
<tr>
<th colspan="3" align="center">
Searching for a group of selectors
</th>
</tr>
<tr>
<td width="20%" align="left">
<a accesskey="p" href="ch07.html">Prev</a>
</td>
<th width="60%" align="center">
Chapter 7. Searching for selectors and properties
</th>
<td width="20%" align="right">
<a accesskey="n" href="ch07s03.html">Next</a>
</td>
</tr>
</table>
</div><br />
<br />
</td>
</tr>
</table>
<div class="sect1" lang="en" xml:lang="en">
<div class="titlepage">
<h2 class="title c1">
<a name="developers.find.selectors" id=
"developers.find.selectors"></a>Searching for a group of selectors
</h2>
</div>
<p>
Let creates these definitions into <code class=
"filename">progress2.css</code> file :
</p>
<div class="css c2">
<ol>
<li class="li1">
<div class="de1">
#PB1.cellPB1I, #PB1<span class="re1">.cellPB1A</span>
<span class="br0">{</span>
</div>
</li>
<li class="li1">
<div class="de1">
<span class="kw1">width</span>: 15px;
</div>
</li>
<li class="li1">
<div class="de1">
<span class="kw1">height</span>: 20px;
</div>
</li>
<li class="li1">
<div class="de1">
<span class="kw1">font-family</span>: Courier, Verdana;
</div>
</li>
<li class="li1">
<div class="de1">
<span class="kw1">font-size</span>: 8px;
</div>
</li>
<li class="li1">
<div class="de1">
<span class="kw1">float</span>: <span class=
"kw1">left</span>;
</div>
</li>
<li class="li1">
<div class="de1">
<span class="br0">}</span>
</div>
</li>
<li class="li1">
<div class="de1">
</div>
</li>
<li class="li1">
<div class="de1">
#PB1<span class="re1">.progressBorderPB1</span> <span class=
"br0">{</span>
</div>
</li>
<li class="li1">
<div class="de1">
<span class="kw1">width</span>: 172px;
</div>
</li>
<li class="li1">
<div class="de1">
<span class="kw1">height</span>: 24px;
</div>
</li>
<li class="li1">
<div class="de1">
<span class="kw1">border-width</span>: 1px;
</div>
</li>
<li class="li1">
<div class="de1">
<span class="kw1">border-style</span>: <span class=
"kw2">solid</span>;
</div>
</li>
<li class="li1">
<div class="de1">
<span class="kw1">border-color</span>: #<span class=
"nu0">404040</span> #dfdfdf #dfdfdf #<span class=
"nu0">404040</span>;
</div>
</li>
<li class="li1">
<div class="de1">
<span class="kw1">background-color</span>: #CCCCCC;
</div>
</li>
<li class="li1">
<div class="de1">
<span class="br0">}</span>
</div>
</li>
<li class="li1">
<div class="de1">
</div>
</li>
<li class="li1">
<div class="de1">
<span class="re1">.progressPercentLabelpct1PB1</span>
<span class="br0">{</span>
</div>
</li>
<li class="li1">
<div class="de1">
<span class="kw1">width</span>: 50px;
</div>
</li>
<li class="li1">
<div class="de1">
<span class="kw1">text-align</span>: <span class=
"kw1">right</span>;
</div>
</li>
<li class="li1">
<div class="de1">
<span class="kw1">background-color</span>: <span class=
"kw2">transparent</span>;
</div>
</li>
<li class="li1">
<div class="de1">
<span class="kw1">font-size</span>: 11px;
</div>
</li>
<li class="li1">
<div class="de1">
<span class="kw1">font-family</span>: Verdana, Tahoma,
Arial;
</div>
</li>
<li class="li1">
<div class="de1">
<span class="kw1">font-weight</span>: <span class=
"kw2">normal</span>;
</div>
</li>
<li class="li1">
<div class="de1">
<span class="kw1">color</span>: #<span class=
"nu0">000000</span>;
</div>
</li>
<li class="li1">
<div class="de1">
<span class="br0">}</span>
</div>
</li>
<li class="li1">
<div class="de1">
</div>
</li>
<li class="li1">
<div class="de1">
<span class="re1">.progressTextLabeltxt1PB1</span> <span class=
"br0">{</span>
</div>
</li>
<li class="li1">
<div class="de1">
<span class="kw1">text-align</span>: <span class=
"kw1">left</span>;
</div>
</li>
<li class="li1">
<div class="de1">
<span class="kw1">background-color</span>: <span class=
"kw2">transparent</span>;
</div>
</li>
<li class="li1">
<div class="de1">
<span class="kw1">font-size</span>: 11px;
</div>
</li>
<li class="li1">
<div class="de1">
<span class="kw1">font-family</span>: Verdana, Tahoma,
Arial;
</div>
</li>
<li class="li1">
<div class="de1">
<span class="kw1">font-weight</span>: <span class=
"kw2">normal</span>;
</div>
</li>
<li class="li1">
<div class="de1">
<span class="kw1">color</span>: #<span class=
"nu0">000000</span>;
</div>
</li>
<li class="li1">
<div class="de1">
<span class="br0">}</span>
</div>
</li>
<li class="li1">
<div class="de1">
</div>
</li>
<li class="li1">
<div class="de1">
<span class="re1">.cellPB1I</span> <span class="br0">{</span>
</div>
</li>
<li class="li1">
<div class="de1">
<span class="kw1">background-color</span>: #CCCCCC;
</div>
</li>
<li class="li1">
<div class="de1">
<span class="br0">}</span>
</div>
</li>
<li class="li1">
<div class="de1">
</div>
</li>
<li class="li1">
<div class="de1">
<span class="re1">.cellPB1A</span> <span class="br0">{</span>
</div>
</li>
<li class="li1">
<div class="de1">
<span class="kw1">background-color</span>: #0033FF;
</div>
</li>
<li class="li1">
<div class="de1">
<span class="br0">}</span>
</div>
</li>
<li class="li1">
<div class="de1">
</div>
</li>
<li class="li1">
<div class="de1">
body <span class="br0">{</span>
</div>
</li>
<li class="li1">
<div class="de1">
<span class="kw1">background-color</span>: #E0E0E0;
</div>
</li>
<li class="li1">
<div class="de1">
<span class="kw1">color</span>: #<span class=
"nu0">000000</span>;
</div>
</li>
<li class="li1">
<div class="de1">
<span class="kw1">font-family</span>: Verdana,
Arial;
</div>
</li>
<li class="li1">
<div class="de1">
<span class="br0">}</span>
</div>
</li>
</ol>
</div>
<p>
Very easy with such script to find where is declared <code class=
"literal">#PB1</code> class selectors (names like).
</p>
<div class="php c2">
<ol>
<li class="li1">
<div class="de1">
<span class="kw2"><?php</span>
</div>
</li>
<li class="li1">
<div class="de1">
<span class="kw1">require_once</span> <span class=
"st0">'HTML/CSS.php'</span>;
</div>
</li>
<li class="li1">
<div class="de1">
</div>
</li>
<li class="li1">
<div class="de1">
<span class="re0">$css</span> = <span class="kw2">new</span>
HTML_CSS<span class="br0">(</span><span class="br0">)</span>;
</div>
</li>
<li class="li1">
<div class="de1">
<span class="re0">$css</span>-><span class=
"me1">parseFile</span><span class="br0">(</span><span class=
"st0">'progress2.css'</span><span class="br0">)</span>;
</div>
</li>
<li class="li1">
<div class="de1">
</div>
</li>
<li class="li1">
<div class="de1">
<span class="co1">// find all selectors beginning with
#PB1</span>
</div>
</li>
<li class="li1">
<div class="de1">
<span class="re0">$styles</span> = <span class=
"re0">$css</span>-><span class=
"me1">grepStyle</span><span class="br0">(</span><span class=
"st0">'/^#PB1/'</span><span class="br0">)</span>;
</div>
</li>
<li class="li1">
<div class="de1">
<span class="kw3">echo</span> <span class=
"st0">'<pre>'</span>; <span class=
"kw3">var_dump</span><span class="br0">(</span><span class=
"re0">$styles</span><span class="br0">)</span>; <span class=
"kw3">echo</span> <span class="st0">'</pre>'</span>;
</div>
</li>
<li class="li1">
<div class="de1">
<span class="kw2">?></span>
</div>
</li>
</ol>
</div>
</div>
<table class="htmlcssFooter">
<tr>
<td align="left">
HTML_CSS : The Definitive Guide
</td>
<td align="right">
v 1.1.3 : February 18, 2007
</td>
</tr>
</table>
<div class="navfooter">
<hr />
<table width="100%" summary="Navigation footer">
<tr>
<td width="40%" align="left">
<a accesskey="p" href="ch07.html">Prev</a>
</td>
<td width="20%" align="center">
<a accesskey="u" href="ch07.html">Up</a>
</td>
<td width="40%" align="right">
<a accesskey="n" href="ch07s03.html">Next</a>
</td>
</tr>
<tr>
<td width="40%" align="left" valign="top">
Chapter 7. Searching for selectors and properties
</td>
<td width="20%" align="center">
<a accesskey="h" href="index.html">Home</a>
</td>
<td width="40%" align="right" valign="top">
Searching for selectors that set a property
</td>
</tr>
</table>
</div>
</body>
</html>
distrib
>
Mandriva
>
2008.1
>
x86_64
>
media
>
contrib-release
>
by-pkgid
>
00062d9a138a4f480a29c418b9a4f3c1
>
files
>
25
