spabloramirez
11/3/2014 - 3:58 PM

emet

emet

//DIV
#myId.myClass{myText}
<div id="myId" class="myClass">myText</div>

//Lorem
lorem10
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Iusto, saepe!

//Child: >
div>ul>li
<div>
	<ul>
		<li></li>
	</ul>
</div>

//Sibling: +
div+p+bq
<div></div>
<p></p>
<blockquote></blockquote>

//Climb-up: ^ 
div+div>p>span+em^bq
<div></div>
<div>
	<p><span></span><em></em></p>
	<blockquote></blockquote>
</div>
div+div>p>span+em^^^bq
<div></div>
<div>
	<p><span></span><em></em></p>
</div>
<blockquote></blockquote>

//Multiplication: *
ul>li*5
<ul>
	<li></li>
	<li></li>
	<li></li>
	<li></li>
	<li></li>
</ul>

//
//Grouping: ()
div>(header>ul>li*2>a)+footer>p
<div>
	<header>
		<ul>
			<li><a href=""></a></li>
			<li><a href=""></a></li>
		</ul>
	</header>
	<footer>
		<p></p>
	</footer>
</div>

(div>dl>(dt+dd)*3)+footer>p
<div>
	<dl>
		<dt></dt>
		<dd></dd>
		<dt></dt>
		<dd></dd>
		<dt></dt>
		<dd></dd>
	</dl>
</div>
<footer>
	<p></p>
</footer>

//ID and CLASS
div#header+div.page+div#footer.class1.class2.class3
<div id="header"></div>
<div class="page"></div>
<div id="footer" class="class1 class2 class3"></div>

//Custom attributes
td[title="Hello world!" colspan=3]
<td title="Hello world!" colspan="3"></td>

//Item numbering: $
ul>li.item$*3
<ul>
	<li class="item1"></li>
	<li class="item2"></li>
	<li class="item3"></li>	
</ul>
//Number Values
ul>li.item$$$*5
<ul>
	<li class="item001"></li>
	<li class="item002"></li>
	<li class="item003"></li>
	<li class="item004"></li>
	<li class="item005"></li>
</ul>

//Text: {}
div{holaMundo}
<div>holaMundo</div>